C# MVC 使用 CKEditor图片上传 提示“不正确的服务器响应”
重点:看一下你使用的CKEditor版本
过程:
后台需要一款富文本编辑器。经过挑选后,最后选择了FCKEditor 的升级版 CKEditor 。在官网下载了4.10.1版本。
经过一番配置后,富文本可以正常显示。在上传图片的时候,出现了问题。一直提示我“不正确的服务器响应”。经过一番搜索发现配置和网上给出的配置都是一样的,却总还是错误。

后来发现一篇说新版本的CKEditor上传图片的返回值修改了。经过一番摸索,终于解决问题。
上图:

原来之前的版本使用的通过 script 控制的tab跳转并填入图片地址的方式新版本已经弃用,改用新的Json 的方式传递。下面贴上配置和后端代码:
CKEditor config.js配置
//上传图片的方法
config.filebrowserImageUploadUrl = "/Home/Upload"; //图片默认显示文字为空
config.image_previewText = ' '; //设置语言
config.language = 'zh-cn'; // 解决CKEditor图片宽度自适应的问题 p img { width: auto; height: auto; max - width: 100 %;}
config.disallowedContent = 'img{width,height};img[width,height]';
后端Upload方法
[HttpPost]
public JsonResult Upload(HttpPostedFileBase upload)
{
string savePath = "/upload/";
string dirPath = Server.MapPath(savePath); //如果目录不存在则创建目录
if (!Directory.Exists(dirPath))
Directory.CreateDirectory(dirPath); //获取图片文件名及扩展名
var fileName = Path.GetFileName(upload.FileName);
string fileExt = Path.GetExtension(fileName).ToLower(); //用时间来生成新文件名并保存
string newFileName = DateTime.Now.ToString("yyyyMMddHHmmss_ffff", DateTimeFormatInfo.InvariantInfo) + fileExt;
upload.SaveAs(dirPath + "/" + newFileName); //上传成功后,我们还需要返回Json格式的响应
return Json(new
{
uploaded = ,
fileName = newFileName,
url = savePath + newFileName
});
}
前端调用
//引入js文件
<script src="~/Content/ckeditor/ckeditor.js"></script>
<script src="~/Content/ckeditor/config.js"></script>
//ckditor容器
@Html.TextAreaFor(model => model.ContentInfo, new { @class = "ckeditor" })
C# MVC 使用 CKEditor图片上传 提示“不正确的服务器响应”的更多相关文章
- springMVC和ckeditor图片上传
springMVC和ckeditor图片上传 http://blog.csdn.net/liuchangqing123/article/details/45270977 修正一下路径问题: packa ...
- 简单2步实现 asp.net mvc ckeditor 图片上传
1.打开ckeditor 包下的 config.js,添加一句 配置(PS:ckeditor 很多功能都在该配置文件里配置),如下: config.filebrowserImageUploadUrl ...
- .net core CKEditor 图片上传
最近在玩 asp.net core,不想用UEditor,想使用CKEditor.故需要图片上传功能. 废话不多说,先上效果图: CKEditor 前端代码: <text id="co ...
- CKEditor图片上传实现详细步骤(使用Struts 2)
本人使用的CKEditor版本是3.6.3.CKEditor配置和部署我就不多说. CKEditor的编辑器工具栏中有一项“图片域”,该工具可以贴上图片地址来在文本编辑器中加入图片,但是没有图片上传. ...
- CKEditor图片上传问题(默认安装情况下编辑器无法处理图片),通过Base64编码字符串解决
准备做一个文章内容网站,网页编辑器采用CKEditor,第一次用,默认安装情况下,图片无法插入,提示没有定义上传适配器(adapter),错误码提示如下: 根据提示,在官网看到有两种途径:一使用CKE ...
- .NET MVC实现多图片上传并附带参数(ajaxfileupload)
做网站呢,都免不了要做图片上传. 还记得去年做微信的时候用WebAPI+ajaxfileupload.js做了一个能够附带参数上传的功能,博文地址:.NET WebAPI 实现图片上传(包括附带参数上 ...
- .net mvc + layui做图片上传(二)—— 使用流上传和下载图片
摘要:上篇文章写到一种上传图片的方法,其中提到那种方法的局限性,就是上传的文件只能保存在本项目目录下,在其他目录中访问不到该文件.这与浏览器的安全性机制有关,浏览器不允许用户用任意的路径访问服务器上的 ...
- .net mvc + layui做图片上传(一)
图片上传和展示是互联网应用中比较常见的一个功能,最近做的一个门户网站项目就有多个需要上传图片的功能模块.关于这部分内容,本来功能不复杂,但后面做起来却还是出现了一些波折.因为缺乏经验,对几种图片上传的 ...
- MVC微信浏览器图片上传(img转Base64)
因公司业务需要,需要做一个微信公众号里的图片上传功能,主要用到的技术就是 img转base64 上到服务器 话不多说, 贴代码 先看前端显示出来的东西 OK 图片不重要,看代码 <!--微信图片 ...
随机推荐
- 使用并发工具实现 RPC 调用流量控制
前言 RPC 服务中,每个服务的容量都是有限的,即资源有限,只能承受住给定的网络请求,所以,在设计 RPC 框架的时候,一定要考虑流量控制这个问题.而 Java 中,实现流量控制有很多中方式,今天说 ...
- 30分钟搞定后台登录界面(103个后台PSD源文件、素材网站)
去年八月时要做一个OA系统为了后台界面而烦恼,后来写了一篇博客(<后台管理UI的选择>)介绍了选择过程与常用后台UI,令我想不到的时竟然有许多开发者与我一样都为这个事情而花费不少时间,最后 ...
- StreamReader 的ReadLine,Read,ReadToEnd方法
1.ReadLine() 当遇到\n \r 或者是\r\n的时候 此方法返回这前面的字符串,然后内部的指针往后移一位下次从新的地方开始读,直到遇到数据的结尾处返回null,所以经常这样使用 ...
- 怎样删除windows.old文件
方法1: 1.在C盘上点右键,选择属性.2.在常规选项卡中点击”磁盘清理“3.稍等片刻再弹出的选项卡中点击清理系统文件4.选中以前Windows的安装5.点击确定即可安全清理 方法二: WIN7中的w ...
- Hibernate自身一对多和多对多关系映射
一对多关系映射大家都明白,关系双方都一个含有对方多个引用,但自身一对多很多同学都不明白什么意思,那么首先我就说明一下什么是自身一对多,其实也很好理解,自身一对多就是自身含有本身的多个引用,例如新闻类别 ...
- Wooden Sticks(hdu1501)(sort,dp)
Wooden Sticks Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) To ...
- 脚本执行错误---/bin/sh^M:损坏的解释器 没有那个文件或目录
在执行脚本时,弹出错误提示: 这是由于脚本文件在保存时使用了DOS文件格式造成的,可以用vim打开文件,然后执行下列操作:
- AutoFac实现WebAPI依赖注入(EF以及Mysql)
什么是依赖注入? 我们以实际的例子来加以介绍 实体如下 public class Product { public int ID { get; set; } public string Name { ...
- BZOJ2957: 楼房重建(分块)
题意 题目链接 Sol 自己YY出了一个\(n \sqrt{n} \log n\)的辣鸡做法没想到还能过.. 可以直接对序列分块,我们记第\(i\)个位置的值为\(a[i] = \frac{H_i}{ ...
- 8.1、包,__init__.py,
包: 为了组织好模块,将多个模块组合为一个包,所以包用于存放python模块 包通常是一个文件夹,当文件夹当作包使用时,文件夹需要包含__init__.py文件 __init__.py的内容可以为空, ...