MVC 使用 Ueditor富文本編輯器


一.Ueditor

1.下載Ueditor富文本編輯器

官方下載地址: http://ueditor.baidu.com/website/download.html

建議下載開發版,此處我下載的是 .net 版本的

 

2.項目中添加Ueditor富文本編輯器

解壓UEditor包,把ueditor文件夾拖到項目中的文件夾下,此處我放在Scripts文件夾下,建議使用項目上方的“顯示所有文件”按鈕,找到要添加到項目中的文件,右鍵“包括在項目中”,Ueditor富文本編輯器就添加到項目中

 

3.項目中使用Ueditor富文本編輯器

首先,引用Ueditor中的JS文件,如下圖:

JS文件順序:先引用ueditor.config.js,再引用ueditor.all.js

 

然后,根據net文件下的index.html中,創建編輯器

 

4.配置Ueditor富文本編輯器

創建編輯器后,運行,顯示編輯器,其中上傳圖片的功能需要進行配置,設置圖片上傳的路徑

(1)圖片上傳配置:

配置位置:Config.json文件

更改上傳路徑,如下圖是我更改后的路徑(相對路徑),其中的{shopid}是可替換的文件夾名稱,替換文件為App_Code/PathFormatter.cs

 

(2)配置工具欄

配置位置:ueditor.config.js

去除不需要的工具,如下圖:

 

 

5.后台使用Ueditor富文本編輯器

問題:Ueditor富文本編輯器,傳值到后台獲取時,直接傳值會報錯

原因:MVC禁止帶HTML標簽的字符串進入后台(禁止帶HTML標簽的字符串進入后台,提高了應用程序的安全性)

解決方案:

1.在web.Config文件中修改

 Web.config增加<httpRuntime requestValidationMode="2.0" />

注意:直接在web.config文件中修改,會降低應用程序的安全性,不建議使用

 

2.只需要在獲取Ueditor編輯器的ActionResult添加 ValidateInput,如下圖:

 注意:[ValidateInput(false)]后,在使用Request獲取Ueditor富文本內容時,會再次報錯,不能使用Request獲取,當前我使用的是FormCollection(form表單集合)

 


免責聲明!

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



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