###粘貼截圖 wangEditor 自`1.3.11`版本開始支持粘貼截圖。 >注意，只是粘貼剪切板中的截圖。如果是單個圖片文件，請配置圖片上傳。上文有詳細描述。 >另外注意，這種高級功能，IE低版本就別想兼容了，不好辦。 如果不進行任何配置，wangEditor 會使用 html5 的文件操作功能，將圖片保存為base64編碼。這樣做既有優點又有缺點。 **優點：** - 無需關心圖片上傳，圖片將以base64編碼的形式存儲在html文件中 - 頁面加載時不用加載圖片文件，減少http請求，提高性能 **缺點：** - base64編碼的圖片，在IE低版本中不顯示 - base64編碼有利于小圖片，而對于大圖片來說，它將比圖片文件大，占用更多的流量 ------------- **如何上傳粘貼的截圖？** 上傳粘貼的截圖也非常簡單，只需要在執行`wangEditor()`時候，傳入一個`pasteUrl`參數，參數只為服務端地址。 ```js $('textarea1').wangEditor({ pasteUrl: '../upload.php' }); ``` 具體的后端代碼可參考[非跨域上傳的后端代碼](http://www.hmoore.net/wangfupeng/wangeditor/65751)，除此之外還需要注意以下幾點： - 后臺必須使用`wangEditorPasteFile`這個 key 來獲取post的文件，例如 `file = request.file['wangEditorPasteFile']` - 后臺程序保存了圖片地址之后，要返回該圖片的url地址 ------- **目前有nodejs的后臺代碼示例可供參考** ```javascript // nodejs API 參考：http://nodeapi.ucdok.com/#/api/ // 需要本地安裝 formidable ，參見 https://github.com/felixge/node-formidable var formidable = require('formidable'); var http = require('http'); var fs = require('fs'); var url = require('url'); var path = require('path'); // 文件將要上傳到哪個文件夾下面 var uploadfoldername = 'uploadfiles'; var uploadfolderpath = __dirname + '/' + uploadfoldername; // 提交的 form 中，input-file 的 name var inputfilename = 'wangEditorPasteFile'; var port = 8888; http.createServer(function (req, res) { // ----------------------用 '/upload' 這個路由來處理文件上傳---------------------- if (req.url === '/upload' && req.method.toLowerCase() === 'post') { // 使用第三方的 formidable 插件初始化一個 form 對象 var form = new formidable.IncomingForm(); // 處理 request form.parse(req, function (err, fields, files) { if (err) { return console.log('formidable, form.parse err'); } // inputfilename 變量存儲的是客戶端頁面中 form 中的 input-file 標簽的 name 屬性值 var file = files[inputfilename]; // formidable 會將上傳的文件存儲為一個臨時文件，現在獲取這個文件的目錄 var tempfilepath = file.path; // 獲取文件類型 var type = file.type; // 獲取文件名，并根據文件名獲取擴展名 var filename = file.name; var extname = filename.lastIndexOf('.') >= 0 ? filename.slice(filename.lastIndexOf('.') - filename.length) : ''; // 文件名沒有擴展名時候，則從文件類型中取擴展名（如粘貼圖片時） if (extname === '' && type.indexOf('/') >= 0) { extname = '.' + type.split('/')[1]; } // 將文件名重新賦值為一個隨機數（避免文件重名） filename = Math.random().toString().slice(2) + extname; // 構建將要存儲的文件的路徑 var filenewpath = uploadfolderpath + '/' + filename; // 將臨時文件保存為正式的文件 fs.rename(tempfilepath, filenewpath, function (err) { // 存儲結果 var result = ''; if (err) { // 發生錯誤 console.log('fs.rename err'); result = 'error'; } else { // 保存成功 console.log('fs.rename done'); // 拼接圖片url地址 result = 'http://localhost:' + port + '/' + uploadfoldername + '/' + filename; } // 返回結果 res.writeHead(200, { 'Content-type': 'text/html' }); res.end(result); }); }); } else { // ---------------------- 其他路由，直接作為靜態文件返回 ---------------------- var pathname = url.parse(req.url).pathname; var filepath = path.join(__dirname, pathname); fs.readFile(filepath, function (err, file) { if (err) { res.writeHead(404); console.log('response file error: ' + filepath); res.end('404 NOT FOUND...'); return; } res.writeHead('200'); console.log('response file success: ' + filepath); res.end(file); }); } }).listen(port); // 監聽 localhost port 端口 console.log('server start at ' + port + '...'); ```