重点:看一下你使用的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图片上传 提示“不正确的服务器响应”的更多相关文章

  1. springMVC和ckeditor图片上传

    springMVC和ckeditor图片上传 http://blog.csdn.net/liuchangqing123/article/details/45270977 修正一下路径问题: packa ...

  2. 简单2步实现 asp.net mvc ckeditor 图片上传

    1.打开ckeditor 包下的  config.js,添加一句 配置(PS:ckeditor 很多功能都在该配置文件里配置),如下: config.filebrowserImageUploadUrl ...

  3. .net core CKEditor 图片上传

    最近在玩 asp.net core,不想用UEditor,想使用CKEditor.故需要图片上传功能. 废话不多说,先上效果图: CKEditor 前端代码: <text id="co ...

  4. CKEditor图片上传实现详细步骤(使用Struts 2)

    本人使用的CKEditor版本是3.6.3.CKEditor配置和部署我就不多说. CKEditor的编辑器工具栏中有一项“图片域”,该工具可以贴上图片地址来在文本编辑器中加入图片,但是没有图片上传. ...

  5. CKEditor图片上传问题(默认安装情况下编辑器无法处理图片),通过Base64编码字符串解决

    准备做一个文章内容网站,网页编辑器采用CKEditor,第一次用,默认安装情况下,图片无法插入,提示没有定义上传适配器(adapter),错误码提示如下: 根据提示,在官网看到有两种途径:一使用CKE ...

  6. .NET MVC实现多图片上传并附带参数(ajaxfileupload)

    做网站呢,都免不了要做图片上传. 还记得去年做微信的时候用WebAPI+ajaxfileupload.js做了一个能够附带参数上传的功能,博文地址:.NET WebAPI 实现图片上传(包括附带参数上 ...

  7. .net mvc + layui做图片上传(二)—— 使用流上传和下载图片

    摘要:上篇文章写到一种上传图片的方法,其中提到那种方法的局限性,就是上传的文件只能保存在本项目目录下,在其他目录中访问不到该文件.这与浏览器的安全性机制有关,浏览器不允许用户用任意的路径访问服务器上的 ...

  8. .net mvc + layui做图片上传(一)

    图片上传和展示是互联网应用中比较常见的一个功能,最近做的一个门户网站项目就有多个需要上传图片的功能模块.关于这部分内容,本来功能不复杂,但后面做起来却还是出现了一些波折.因为缺乏经验,对几种图片上传的 ...

  9. MVC微信浏览器图片上传(img转Base64)

    因公司业务需要,需要做一个微信公众号里的图片上传功能,主要用到的技术就是 img转base64 上到服务器 话不多说, 贴代码 先看前端显示出来的东西 OK 图片不重要,看代码 <!--微信图片 ...

随机推荐

  1. HashMap底层原理分析(put、get方法)

    1.HashMap底层原理分析(put.get方法) HashMap底层是通过数组加链表的结构来实现的.HashMap通过计算key的hashCode来计算hash值,只要hashCode一样,那ha ...

  2. 获取当前iframe动态加载文档的href

    Insus.NET想实现一个功能,一个旧的站点A,它有两个网页logon.aspx和Default.aspx(登录成功能访问).由于某些原因,需另建一个新站点B,这个新站点B也有两个网页B_Index ...

  3. PHP错误集锦

    错误原因:分页数据不够,使用了缓存,但是model类中又没有添加缓存.解决办法:在model类中添加缓存,内容结束时清空缓存.

  4. CSS 分类 选择器

      CSS:层叠样式表(英文全称:Cascading Style Sheets)         后缀名:css         标志  style         对网页中元素位置的排版进行像素级精 ...

  5. Hibernate里面如何使用DetachedCriteriaCriteria 实现多条件分页查询

    WEB层: // 获取分页的请求参数 String start = request.getParameter("start"); String page = request.get ...

  6. Java异常捕获之一道try-catch-finally语句题

    今天,学习了try-catch-finally语句,本来觉得蛮简单.易懂的.搜了一道相关类型的题.结果信心被泼了盆冷水.先把题Mark一下,出去透透风. public class TestEx { p ...

  7. JAVA设计模式详解(六)----------状态模式

    各位朋友,本次LZ分享的是状态模式,在这之前,恳请LZ解释一下,由于最近公司事情多,比较忙,所以导致更新速度稍微慢了些(哦,往后LZ会越来越忙=.=). 状态模式,又称状态对象模式(Pattern o ...

  8. JAVA generic array 泛型数组

    在JAVA中是不支持泛型数组的,不能通过 Z[] array=new Z[10] 这样的方式来创建数组,而是使用反射Aarry.newInstance来创建: 具体代码如下: public Z[][] ...

  9. cf113D. Museum(期望 高斯消元)

    题意 题目链接 Sol 设\(f[i][j]\)表示Petya在\(i\),\(Vasya\)在\(j\)的概率,我们要求的是\(f[i][i]\) 直接列方程高斯消元即可,由于每个状态有两维,因此时 ...

  10. js-redux学习笔记2

    1.为了 dispatch 一个 action,我们需要一个 dispatch 函数.可以用一个 action creator 去发送一个 action. var setNameActionCreat ...