# 上傳到七牛云存儲 完整的 demo 請參見 https://github.com/wangfupeng1988/js-sdk ，可下載下來本地運行 demo > 注意：配置了上傳七牛云存儲之后，**無法再使用插入網絡圖片** 核心代碼如下： ```js var E = window.wangEditor var editor = new E('#div1') // 允許上傳到七牛云存儲 editor.customConfig.qiniu = true editor.create() // 初始化七牛上傳 uploadInit() // 初始化七牛上傳的方法 function uploadInit() { // 獲取相關 DOM 節點的 ID var btnId = editor.imgMenuId; var containerId = editor.toolbarElemId; var textElemId = editor.textElemId; // 創建上傳對象 var uploader = Qiniu.uploader({ runtimes: 'html5,flash,html4', //上傳模式,依次退化 browse_button: btnId, //上傳選擇的點選按鈕，**必需** uptoken_url: '/uptoken', //Ajax請求upToken的Url，**強烈建議設置**（服務端提供） // uptoken : '<Your upload token>', //若未指定uptoken_url,則必須指定 uptoken ,uptoken由其他程序生成 // unique_names: true, // 默認 false，key為文件名。若開啟該選項，SDK會為每個文件自動生成key（文件名） // save_key: true, // 默認 false。若在服務端生成uptoken的上傳策略中指定了 `sava_key`，則開啟，SDK在前端將不對key進行任何處理 domain: 'http://7xrjl5.com1.z0.glb.clouddn.com/', //bucket 域名，下載資源時用到，**必需** container: containerId, //上傳區域DOM ID，默認是browser_button的父元素， max_file_size: '100mb', //最大文件體積限制 flash_swf_url: '../js/plupload/Moxie.swf', //引入flash,相對路徑 filters: { mime_types: [ //只允許上傳圖片文件 （注意，extensions中，逗號后面不要加空格） { title: "圖片文件", extensions: "jpg,gif,png,bmp" } ] }, max_retries: 3, //上傳失敗最大重試次數 dragdrop: true, //開啟可拖曳上傳 drop_element: textElemId, //拖曳上傳區域元素的ID，拖曳文件或文件夾后可觸發上傳 chunk_size: '4mb', //分塊上傳時，每片的體積 auto_start: true, //選擇文件后自動上傳，若關閉需要自己綁定事件觸發上傳 init: { 'FilesAdded': function(up, files) { plupload.each(files, function(file) { // 文件添加進隊列后,處理相關的事情 printLog('on FilesAdded'); }); }, 'BeforeUpload': function(up, file) { // 每個文件上傳前,處理相關的事情 printLog('on BeforeUpload'); }, 'UploadProgress': function(up, file) { // 顯示進度 printLog('進度 ' + file.percent) }, 'FileUploaded': function(up, file, info) { // 每個文件上傳成功后,處理相關的事情 // 其中 info 是文件上傳成功后，服務端返回的json，形式如 // { // "hash": "Fh8xVqod2MQ1mocfI4S4KpRL6D98", // "key": "gogopher.jpg" // } printLog(info); // 參考http://developer.qiniu.com/docs/v6/api/overview/up/response/simple-response.html var domain = up.getOption('domain'); var res = $.parseJSON(info); var sourceLink = domain + res.key; //獲取上傳成功后的文件的Url printLog(sourceLink); // 插入圖片到editor editor.cmd.do('insertHtml', '<img src="' + sourceLink + '" style="max-width:100%;"/>') }, 'Error': function(up, err, errTip) { //上傳出錯時,處理相關的事情 printLog('on Error'); }, 'UploadComplete': function() { //隊列文件處理完畢后,處理相關的事情 printLog('on UploadComplete'); } // Key 函數如果有需要自行配置，無特殊需要請注釋 //, // 'Key': function(up, file) { // // 若想在前端對每個文件的key進行個性化處理，可以配置該函數 // // 該配置必須要在 unique_names: false , save_key: false 時才生效 // var key = ""; // // do something with key here // return key // } } // domain 為七牛空間（bucket)對應的域名，選擇某個空間后，可通過"空間設置->基本設置->域名設置"查看獲取 // uploader 為一個plupload對象，繼承了所有plupload的方法，參考http://plupload.com/docs }); } // 封裝 console.log 函數 function printLog(title, info) { window.console && console.log(title, info); } ```