自動導入Word圖檔，或者粘貼Word内容時自動上傳所有的圖檔，并且最終保留Word樣式，這應該是Web編輯器裡面最基本的一個需求功能了。一般情況下我們将Word内容粘貼到Web編輯器（富文本編輯器）中時，編輯器都無法自動上傳圖檔。需要使用者手動一張張上傳Word圖檔。如果隻有一張圖檔還能夠接受，如果圖檔數量比較多，這種操作就顯得非常的麻煩。
1、隻粘貼圖檔并上傳到伺服器
config.extraPlugins = 'uploadimage';
//config.uploadUrl = '上傳路徑';
config.imageUploadUrl= '上傳路徑';
請求
檔案上傳的預設請求是一個檔案，作為具有“upload”字段的表單資料。
響應：檔案已成功上傳
當檔案成功上傳時的JSON響應：
uploaded- 設定為1。
fileName - 上傳檔案的名稱。
url - 上傳檔案的URL。
響應：檔案無法上傳
uploaded- 設定為0。
error.message - 要顯示給使用者的錯誤消息。
using System;
using System.Web;
using System.IO;
namespace WordPasterCK4
{
public partial class upload : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string fname = Request.Form["UserName"];
int len = Request.ContentLength;
if (Request.Files.Count > 0)
{
DateTime timeNow = DateTime.Now;
string uploadPath = "/upload/" + timeNow.ToString("yyyyMM") + "/" + timeNow.ToString("dd") + "/";
string folder = Server.MapPath(uploadPath);
//自動建立目錄
if (!Directory.Exists(folder)) Directory.CreateDirectory(folder);
HttpPostedFile file = Request.Files.Get(0);
//原始檔案名稱，由控件自動生成。
//md5.png,crc.png,uuid.png,sha1.png
string nameOri = file.FileName;
string ext = Path.GetExtension(nameOri).ToLower();
//隻支援圖檔上傳
if ( ext == ".jpg"
|| ext == ".jpeg"
|| ext == ".png"
|| ext == ".gif"
|| ext == ".bmp")
{
string filePathSvr = Path.Combine(folder, nameOri);
//
if(!Directory.Exists(filePathSvr)) file.SaveAs(filePathSvr);
Response.Write("http://10.168.4.209:83" + uploadPath + nameOri);
}
}
}
}
}
2、粘貼word裡面的圖檔路徑是fill://D 這種格式 我了解這種是非浏覽器安全的 許多浏覽器也不支援
目前項目是用了一種變通的方式：
先把word上傳到背景 、poi解析、存儲圖檔 、轉換html、替換圖檔、放到富文本框裡顯示
（富文本顯示有個坑：沒找到直接給富文本指派的方法 要先銷毀 記錄下
var WordPasterConfig = {
"EncodeType" : "GB2312"
, "Company" : "荊門澤優軟體有限公司"
, "Version" : "1,5,131,51655"
, "License2": ""
, "Debug" : false//調試模式
, "LogFile" : "f:\\log.txt"//日志檔案路徑
, "PasteWordType" : "" //粘貼WORD的圖檔格式。JPG/PNG/GIF/BMP，推薦使用JPG格式，防止出現大圖檔。
, "PasteImageType" : "" //粘貼檔案，剪帖闆的圖檔格式，為空表示本地圖檔格式。JPG/PNG/GIF/BMP
, "PasteImgSrc" : "" //shape:優先使用源公式圖檔，img:使用word自動生成的圖檔
, "JpgQuality" : "100" //JPG品質。0~100
, "QueueCount" : "5" //同時上傳線程數
, "CryptoType" : "crc"//名稱計算方式,md5,crc,sha1,uuid，其中uuid為随機名稱
, "ThumbWidth" : "0" //縮略圖寬度。0表示不使用縮略圖
, "ThumbHeight" : "0" //縮略圖高度。0表示不使用縮略圖
, "FileFieldName" : "file"//自定義檔案名稱名稱
, "ImageMatch" : ""//伺服器傳回資料比對模式，正規表達式，提取括号中的位址
, "FormulaDraw" : "gdi"//公式圖檔繪制器，gdi,magick
, "AppPath" : ""
, "Cookie" : ""
, "Servers" :[{"url":"www.ncmem.com"},{"url":"www.xproerui.com"}]//内部伺服器位址(不下載下傳此位址中的圖檔)
, "IcoError" : "http://www.ncmem.com/products/word-imagepaster/ckeditor353/WordPaster/error.png"
, "IcoUploader" : "http://www.ncmem.com/products/word-imagepaster/ckeditor353/WordPaster/upload.gif"
, "PostUrl" : "http://www.ncmem.com/products/word-imagepaster/fckeditor2461/asp.net/upload.aspx"
//x86
, "ClsidParser" : "2404399F-F06B-477F-B407-B8A5385D2C5E"
, "CabPath" : "http://www.ncmem.com/download/WordPaster2/WordPaster.cab"
//x64
, "ClsidParser64" : "7C3DBFA4-DDE6-438A-BEEA-74920D90764B"
, "CabPath64" : "http://www.ncmem.com/download/WordPaster2/WordPaster64.cab"
//Firefox
, "XpiType" : "application/npWordPaster2"
, "XpiPath" : "http://www.ncmem.com/download/WordPaster2/WordPaster.xpi"
//Chrome
, "CrxName" : "npWordPaster2"
, "CrxType" : "application/npWordPaster2"
, "CrxPath" : "http://www.ncmem.com/download/WordPaster2/WordPaster.crx"
//Edge
, edge: { protocol: "wordpaster", port: 9200, visible: false }
, "ExePath": "http://www.ncmem.com/download/WordPaster2/WordPaster.exe"
, "mac": {path: "http://www.ncmem.com/download/WordPaster2/WordPaster.exe"}
};
3、官方剛發表新版本說已經添加功能：
ckeditor編輯器批量上傳的效果
圖檔已經上傳到伺服器端
圖檔位址已經替換過來了
可以看得出來，效果和使用者體驗都非常好。使用者借助于此功能編輯功能得到大幅度提升了。
ckeditor粘貼上傳圖檔 – 澤優軟體部落格