做前後端分離的專案用到UEditor，把上傳圖片程式拿出來放到了介面程式中，上傳圖片介面已經做了跨域處理，按理說編輯器中上傳圖片應該不會有問題。可是配置好圖片上傳路徑後，執行，開啟除錯，測試一下，報錯了：

 找到上傳圖片的程式碼，發現引用的是webuploader.js，先修改下，直接引用webuploader.js。

 經過除錯找到，實際上傳圖片走的就是這裡了，webuploader.js檔案。

 起初在網上查，嘗試了各種方案修改前後端程式碼，都不成功。偶然想起用jquery ajax上傳試試吧，正好程式已經引用了jquery。於是修改上面那行程式碼：

$.ajax({
    url:server,
    dataType:'json',
    type:opts.method,
    async: false,
    data: formData,
    processData : false, // 使資料不做處理
    contentType : false, // 不要設定Content-Type請求頭
    success: function(data){
　　　　console.log(data);
    },
    error:function(response){
　　　　console.log(response);
    }
});

// xhr.send( formData );

一試之下，竟然成功了，看來後端的跨域設定肯定沒問題。

 那這樣也不行啊，前端進度什麼的都沒了。

 找到更新進度的程式碼，就這裡了。

那讓jquery ajax使用這裡的xhr物件行不行呢，試一下，修改上傳部分程式碼：

$.ajax({
    url:server,
    dataType:'json',
    type:opts.method,
    async: false,
    data: formData,
    xhr: function(){
        return xhr; // 使用上面初始化好的 xhr 物件
    },
    processData : false, // 使資料不做處理
    contentType : false, // 不要設定Content-Type請求頭
    success: function(data){
        console.log(data);
    },
    error:function(response){
        console.log(response);
    }
});

// xhr.send( formData );        

 上傳圖片測試一下，ok，成功啦。

看起來似乎就這麼結束了，可這對我來說這算是意外之喜，我真沒覺得這樣就能成功。寫文章之前真正用的時候可沒這麼容易就解決這個問題。

好吧，對比了下，發現之前寫的程式碼沒有 async: false 這個屬性。好，現在註釋掉這個屬性再試，果然不行了，跨域錯誤又報出來了。

 下面說另一種能非同步上傳的解決方案，研究過程就不說了。

1、找到這行程式碼，註釋掉，去掉請求頭的設定。

 2、找到負責更新進度的程式碼，註釋掉這一段

3、把剛才修改成jquery ajax上傳的程式碼刪掉，用原來的程式碼

 再試，ok，是成功的，更新進度的功能依然存在。

說明一下：這裡用的是編輯器的多圖上傳，單圖上傳的沒使用，想來修改方法應該也是同樣的，需要用的可以自己嘗試修改。