ASP.NET MVC中 CKeditor 通过两种方法向后台传值以及编码、乱码问题
上一次说到,我第一次使用CKeditor是用在的新弹出一个页面,即js的showdialogmodel,这时候是直接在该aspx页面引用CKeditor.js和CKfinder.js。第二次是在主页面下,没有弹出新页面,这时候需要在主页面引用js.
在第二次的使用时还遇到以下一些问题,一一解决掉。
1,CKeditor的实例创建与销毁;2,ASP.NET MVC标签传值与Ajax传值的区别; 3,用ajax传值时候,Unicode的编码问题。
首先来看看第一个问题。
在各位正确的引用脚本后,使用CKeditor自带的实例化方法就可以创建CKeditor编辑器了。我的项目js源码如下:
var instance1 = CKEDITOR.instances['developStandardContent']; //'developStandardContent'为aspx页面中textarea的id
if (instance1) {
CKEDITOR.remove(instance1);
}
//以上代码就是解决该CKEDITOR实例已经存在的问题。先判断有没有对‘developStandardContent’实例化,有就销毁,没有就重新创建。因为每//次刷新局部页面的时候,它总会提示说该实例已经存在。原因可能是,局部刷新并没有把原来的实例给销毁,必须将整个页面刷新后才不会出现实例存在//的错误提示。用这个方法,就可以实现局部刷新,方便在写代码的时候进行调试,而且也更加人性化。
editorDPStandardContent = CKEDITOR.replace('developStandardContent', //实例化
{
filebrowserBrowseUrl: '/ckfinder/ckfinder.html',
filebrowserImageBrowseUrl: '/ckfinder/ckfinder.html?Type=Images',
filebrowserFlashBrowseUrl: '/ckfinder/ckfinder.html?Type=Flash',
filebrowserUploadUrl: '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files',
filebrowserImageUploadUrl: '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images',
filebrowserFlashUploadUrl: '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash'
});
editorDPStandardContent.setData(msgDPStandard); //设置编辑器中的内容,msgDPStandard为内容的值,可以是变量或字符串
其次,是传值的问题。
如果用的是ASP.NET MVC标签,这也是我在第一次使用CKEDITOR时候用的传值方法,通过该标签可以直接将数据库字段的值绑定,后台便可以直接获取,无需ajax。这时候,要主要的编码问题就是<>的编码,这个在ASP.NET MVC中被认为是危险数据。所以从CKEDITOR中取出的值要先进行编码的转换,同时后台接收的时候进行还原。这个方法,我在第一篇文章中已经说过,不再赘述。
如果不使用ASP.NET MVC标签,其实很多时候,我们无需使用MVC标签传值,而是直接用ajax,这样方便些。这时候也会遇到编码问题,不光是<>的编码,还有Unicode的编码。因为我使用的事jquery的ajax传值,而jquery传值的时候对所传内容进行了unicode编码。因此,即使ckeditor中内容为空,提取出来的并传值的时候,jquery会将其编码为“\\u0009”("\\u0000")忘记是哪个了。。呵呵。通过上面的编码转换,在后台数据进行保存的时候,这种“\\u0009”字符并不能解码。所以,数据取出来的时候,空白的内容就多了“\\u0009”。这是用户和开发人员都不愿意看到的。
其解决方法就是在前台或者后台对数据进行Unicode的解码或者替换。在前台似乎不好操作,我试过用数组打包以及json打包,都不能去掉Unicode编码,于是暂且从后台进行修改吧。从网上查到了关于Unicode的解码方法,不过不符合要求,笔者对其进行了改动,源码如下:
public static string replaceUnicode(string str) //str为从前台传来的数据
{
string r = "";
string mark = "";
MatchCollection mc = Regex.Matches(str, @"\\u([\w]{2})([\w]{2})", RegexOptions.Compiled | RegexOptions.IgnoreCase);
byte[] bts = new byte[2];
foreach (Match m in mc)
{
bts[0] = (byte)int.Parse(m.Groups[2].Value, NumberStyles.HexNumber);
bts[1] = (byte)int.Parse(m.Groups[1].Value, NumberStyles.HexNumber);
mark = "\\u" + m.Groups[1].Value+m.Groups[2].Value; //得到字符串中的Unicode编码
r = Encoding.Unicode.GetString(bts); //将Unicode编码转换成对应的字符串符号
str = str.Replace(mark, r); //然后将str中的Unicode转化成相应的字符串
}
return str;
}
这样,数据中的“\\u0000”"\\u0009"就转换成了相应的“\n”"\r"等等,问题解决。
最后,没有最后了,第二个和第三个问题在上面一起说明了。
先写到这里,手上任务中,先工作了。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· C#/.NET/.NET Core技术前沿周刊 | 第 29 期(2025年3.1-3.9)
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异