百度文本編輯器 Ueditor for net 使用七牛存儲附件的實現

百度編輯器功能強大,確實好用,惋惜附件使用本地存儲,若是網站的用戶量巨大,則會使得網站目錄變得很是龐大,並且文件不易於管理,七牛雲存儲在附件存儲方面下了很多功夫,用起來感受不錯,要是將ueditor 的附件存儲改成七牛,那就解決大量帖子的附件存儲問題了javascript

下載新版的 ueditor for net , 解壓後直接將ueditor目錄複製到mvc 項目目錄的根目錄下java

接下來查看 /ueditor/net/app_code/uploadHandler.cs,找到下面這段保存附件的代碼json

 try
        {
            if (!Directory.Exists(Path.GetDirectoryName(localPath)))
            {
                Directory.CreateDirectory(Path.GetDirectoryName(localPath));
            }
            File.WriteAllBytes(localPath, uploadFileBytes);
            Result.Url = savePath;
            Result.State = UploadState.Success;
        }
        catch (Exception e)
        {
            Result.State = UploadState.FileAccessError;
            Result.ErrorMessage = e.Message;
        }
        finally
        {
            WriteResult();
        }

在代碼中,能夠看到文件被保存在  localPath 中,好吧,開始修改七牛雲存儲

 try
        {
            if (!Directory.Exists(Path.GetDirectoryName(localPath)))
            {
                Directory.CreateDirectory(Path.GetDirectoryName(localPath));
            }
            //File.WriteAllBytes(localPath, uploadFileBytes);
            //Result.Url = savePath;
           #region < -- 將服務器端文件上傳至七牛 -- >
            OssService oss = new OssService();
            Attachment attc = new Attachment();
            FileInfo fi = new FileInfo(uploadFileName);
            attc.FileName = fi.Name;
            attc.FileExt = fi.Extension;
            attc.RelationId = RelationId;
            attc.UserName = OwnerName;
            attc.Uploaddate = DateTime.Now;
            attc.AttachmentType = AttachmentType.goods;
            oss.PutFileToQiniu(localPath, attc);
            #endregion
            Result.Url = attc.FileUrl;
            Result.State = UploadState.Success;
        }
        catch (Exception e)
        {
            Result.State = UploadState.FileAccessError;
            Result.ErrorMessage = e.Message;
        }
        finally
        {
            WriteResult();
        }    

  

OssService 是我項目中一個七牛雲存儲的文件控制邏輯,具體代碼懶得貼出來了,也就是引用七牛的.net 開發包,將文件從服務端保存到七牛雲端,用過七牛的都知道怎麼回事。Attachment 是我項目中的一個附件對象,處理邏輯已經包含在OssService中了。服務器

 

這裏細心的朋友也許就會發現,代碼中使用了OwnerName 和 RelationId  兩個變量,這兩個變量也就是當前網站用戶的用戶名,還有這個附件相關聯的帖子 Id 了,但是在這裏怎麼獲得呢?其實 ueditor 已經給出了擴展的方法,我這裏簡單提一下,你須要修改uploadHandler 的構造函數,以下mvc

public UploadHandler(HttpContext context, UploadConfig config)
        : base(context)
    {
        this.UploadConfig = config;
        RelationId = context.Request["RelationId"] != null ? context.Request["RelationId"].ToString() : "";
        OwnerName = context.Request["OwnerName"] != null ? context.Request["OwnerName"].ToString() : "";
        this.Result = new UploadResult() { State = UploadState.Unknown };
    }

 

而後呢,修改ueditor 的初始化代碼將這兩個變量傳進來app

<script id="container" name="content" type="text/plain">
                    @Html.Raw(Model.DescriptionDetail)
                </script>
                <!-- 配置文件 -->
                <script type="text/javascript" charset="utf-8" src="~/ueditor/ueditor.config.js"></script>
                <!-- 編輯器源碼文件 -->
                <script type="text/javascript" charset="utf-8" src="~/ueditor/ueditor.all.js"></script>
                <!-- 實例化編輯器 -->
                <script type="text/javascript">
                    var ue = UE.getEditor('container');
                    ue.ready(function(){
                        ue.execCommand('serverparam', {
                            'RelationId': '@Model.ShopId',
                            'OwnerName': '@User.Identity.Name'
                        });
                    });
                    
                </script>

其實ueditor 已經爲咱們作好了擴展的接口啦,初始化ueditor 時將這兩個變量做爲 serverparam 配置好就好了編輯器

如今,基本已經能夠正常工做了,暫時仍是滿意的,不過使用中發現若是在ueditor 中使用單個文件上傳的功能,發現返回的url 不對,url爲 "/ueditor/net/http://xxxx..." ,原來ueditor 自動爲咱們返回的圖片url 添加了前綴,致使編輯時圖片不正常,不過要解決這個很簡單,直接找到 \ueditor\net\config.json ,將imageUrlPrefix 從 "/ueditor/net/" 修改成 "" 就行了。函數

 

如今上傳文件是搞掂了,下來就是附件列表的問題了。修改 /ueditor/net/app_code/listHandler.cs ,找到這段代碼網站

 1 try
 2         {
 3             var localPath = Server.MapPath(PathToList);
 4             buildingList.AddRange(Directory.GetFiles(localPath, "*", SearchOption.AllDirectories)
 5                 .Where(x => SearchExtensions.Contains(Path.GetExtension(x).ToLower()))
 6                 .Select(x => PathToList + x.Substring(localPath.Length).Replace("\\", "/")));
 7             Total = buildingList.Count;
 8             FileList = buildingList.OrderBy(x => x).Skip(Start).Take(Size).ToArray();
 9             
10         }

 

 1 try
 2         {
 3             //var localPath = Server.MapPath(PathToList);
 4             //buildingList.AddRange(Directory.GetFiles(localPath, "*", SearchOption.AllDirectories)
 5             //    .Where(x => SearchExtensions.Contains(Path.GetExtension(x).ToLower()))
 6             //    .Select(x => PathToList + x.Substring(localPath.Length).Replace("\\", "/")));
 7             //Total = buildingList.Count;
 8             //FileList = buildingList.OrderBy(x => x).Skip(Start).Take(Size).ToArray();
 9             OssService oss = new OssService();
10             Total = oss.GetShopFilesCount(SearchExtensions, RelationId);
11             FileList = oss.GetShopFiles(SearchExtensions, RelationId, Start, Size).ToArray();
12         }

好了,一切ok ,目前用着還能夠,惟一不爽的就是 ueditor 的上傳附件管理窗口中居然沒有刪除附件的功能,噁心,有時間再改吧

相關文章
相關標籤/搜索