1、    kindeditor 灌水 (下载地址,demo)

 
       经过两天的折磨,又源代码,又官网学习,又网络搜索的,终于成功的嵌入KindEditor了。

KindEditor确实是个不错的富文本编辑器,纯JS,比起JQuery写的,夸浏览器更佳。
所以在多种富文本编辑器中,死死认定了KE就是我要的~~

网站里有相应的DEMO以及解说
 
         KE除了图片上传(个人浅见),其他功能并不会涉及到框架问题。
 
2、图片上传改动:
将KE嵌入项目之后,找到进入plugins -- image ,打开image.html
A、找到  var imageUploadJson = (typeof KE.g[id].imageUploadJson == 'undefined') ? '../../php/upload_json.php' :     KE.g[id].imageUploadJson;  KE默认是用PHP来处理图片上传的,所以改成自己的(如:upload_json.jsp)。
路径要注意咯~~
 
之后就开始写(upload_json.jsp)自己的处理过程了。
因为KE图片上传功能是通过Ajax实现的,所以,对JSONObject这些jar包是免不了的。下载的KE包里有json_simple-1.1.jar。省了功夫去找。
 
 
B、只要对下载下来的JSP(版) 上传文件demo文件里的 upload_json.jsp 进行文件存储路径的修改就可以轻易搞定,完全不需要自己去动工。
 
 
不过如果是用SSH框架,而Struts2 web.xml 配置的Struts过滤器如下的话:

也就是对所有的访问请求进行过滤,那么通常会在使用KE上传本地图片时会报 “服务器发生故障”之类的错误。

Struts2 对 所有 enctype="multipart/form-data"(上传文件用的表单数据类型) 的表单的request进行了封装。打包成MultiPartRequestWrapper 。这就导致拿不到原本的request了。
有个简单的方法是将url-pattern 标签里的内容改成其他的,如:*.action 。在路径以及其他的小问题都有注意修改的情况下,这样就可以上传图片成功了,并且可以在textarea里看到图片。
 
      不过,又会有其他的问题产生,比如,你的网页经常性用到 struts-tag 标签,那么可能就会报 404 或者 500 的错误,因为普通jsp网页在没有调用action时,使用struts标签会访问不到元素。
又一个纠结(悲剧,项目做到后面才去玩KE,所以,还是不改动url了)~~ 自己写action处理上传吧,也不怎么奏效。
 
查了查资料,其实,这是struts带给我们的方便。在不改动<url-pattern>/*</ url-pattern>的情况下重写upload_json.jsp
 
3、代码:
 
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page import="org.apache.struts2.dispatcher.multipart.MultiPartRequestWrapper"%>
<%@page import="java.util.concurrent.locks.*" %>
<%@page import="java.io.*" %>
<%@ page import="org.json.simple.*" %>
 
<%
//Struts2 请求 包装过滤器
MultiPartRequestWrapper wrapper = (MultiPartRequestWrapper)request;
//获得上传的文件名
String fileName = wrapper.getFileNames("imgFile")[0];
//获得未见过滤器
File file = wrapper.getFiles("imgFile")[0];
//----------重新构建上传文件名---------
final Lock lock = new ReentrantLock();
String newName = null;
lock.lock();
try{
//加锁为防止文件名重复
newName = System.currentTimeMillis()
  +fileName.substring(fileName.lastIndexOf("."),
  fileName.length());
}finally{
lock.unlock();
}
//------锁结束---------
//获取文件输出流
FileOutputStream fos = new FileOutputStream(request.getSession()
.getServletContext().getRealPath("/")
+"team/" + newName);
//设置 KE 中的图片文件地址
String newFileName = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ request.getContextPath() + "/team/" + newName;
byte[] buffer = new byte[1024];
//获取内存中当前文件输入流
InputStream in = new FileInputStream(file);
try{
int num = 0;
while((num = in.read(buffer)) > 0){
fos.write(buffer,0,num);
}
}catch(Exception e){
e.printStackTrace(System.err);
}finally{
in.close();
fos.close();
}
//发送给 KE 
 
JSONObject obj = new JSONObject();
obj.put("error", 0);
obj.put("url", newFileName);
out.println(obj.toJSONString());
%>
               OK,成功了~~ 总算搞定了~~

最新文章

  1. javascript 变量提前
  2. sql server 行转列解决方案
  3. Java 测试URL地址是否能正常连接
  4. WEB程序调用客户端程序
  5. jquery php ajax 表单验证
  6. jQuery如何去判断页面是否有父页面?
  7. 指定 ubuntu server ip
  8. Lucene.net常用功能说明
  9. android AppWidgwtProvider学习
  10. CSS3实战开发:使用CSS3实现photoshop的过滤效果
  11. 分享一次Oracle数据导入导出经历
  12. ssh: Could not resolve hostname git.*****-inc.com : Temporary failure in name resolution fatal: The remote end hung up unexpectedly
  13. Python内置函数(58)——input
  14. 酷痞运行于openwrt路由系统
  15. C语言学习记录之二
  16. 网络流24题 第五题 - PowerOJ1740 CodeVS1905 圆桌问题 二分图多重匹配 网络最大流
  17. 对vue生命周期的理解
  18. 【nodeJs】nodejs
  19. soj1010. Zipper
  20. Maven学习之(二)Maven插件创建项目

热门文章

  1. 【Container With Most Water】cpp
  2. Windows下MySQL8.0.11.0安装教程
  3. 整合SpringMVC与Mybatis
  4. lua源码分析 伪索引
  5. script error总结
  6. 浅谈 easyui tabs 的href和content属性
  7. bzoj 2563 贪心 思想
  8. Vue中slot内容分发
  9. spoj 8222 NSUBSTR 求长度为x的子串中出现次数最大值 SAM
  10. linux服务器端口netstat