百度編輯器圖片上傳功能解疑


 項目中使用了百度編輯器ueditor,這里是官網鏈接,效果還算不錯,使用中的一些經驗,分享在這里。

我使用的環境是.NET MVC3

最頭疼的上傳圖片問題

ueditor自帶了圖片上傳功能,原理也是使用flash上傳。但是我按照官方的配置修改相應的參數后,發現上傳出現問題,具體體現在:

本地上傳圖片,觸發上傳按鈕后,上傳失敗,代碼中提示 Flash插件初始化失敗,請更新您的FlashPlayer版本之后重試!,主流瀏覽器都是這個錯誤

 

起初我把問題集中在可以看到的錯誤”提示flash插件初始化錯誤“,但是這是一個迷惑性的提示,錯誤的根本原因不在這里。

先看看項目的配置

上傳功能是通過Image.html內部的js調用.NET文件夾中的”后台方法“實現的,ueditor內置了一些.net處理邏輯

在排錯的過程中,我發現一個問題,上傳過程不能調試進入內置的后台方法中,實際上根本原因是,組件中的Uploader類不在整個.NET解決方案的編譯范圍內

前台上傳頁面Image.html獲取不到后台圖片的json信息,導致上傳失敗。

建議

ueditor內置了一些.net處理邏輯只是為了實現基本的功能,具體項目中這些代碼需要集中優化。Uploader文件必須單獨提出來編譯,才能完成圖片上傳功能

版本選擇和自定義配置

ueditor提供按需下載的功能,但是這個頁面有時候會屏蔽,所以還是下載完整版本,開放具體使用的功能,比較科學和安全

由於ueditor是開源編輯器,下載使用時最好記錄使用的具體版本和支持語言框架。我們通常最常見的自定義配置是工具欄,而這些配置都是可以按需增減的。

這里的按需增減不僅體現在在全局配置文件中配置,還可以在使用的外圍通過js操作配置文件來實現。

1 修改配置項的json數組  window.UEDITOR_CONFIG.toolbars 

2 通過     console.log(window.UEDITOR_CONFIG.toolbars[0]);工具欄配置項

3 增加具體的配置 window.UEDITOR_CONFIG.UserId=100;

通過構造函數,修改其它的配置項

var editor = new baidu.editor.ui.Editor({

pasteplain: true,

imageUrl:""

});

     記得推薦下

暫時寫在這里,歡迎大家討論,如果覺得有幫助,推薦下吧

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM