`

KindEditor的上传图片CGI(JSP版)

阅读更多
  见过、用过很多网页在线编辑器,如:fckEditor、eWebEditor、htmlarea等,也简单看过、修改过其中的代码。但我觉得KindEditor的框架结构最为小巧、合理、精致。程序代码比较优美、易懂。

  功能上,有个我也比欣赏的,就可提供了方便的上传本地图片的扩展编程接口,自带了asp、php的上传CGI程序。我做的项目里一般用java用的比较多一点。可官方没有提供,就自已写了一个。相信有跟我一样需求的朋友,把程序贴在下面,大家拿去用好了。

  我还添加了一个上传附件的功能,跟上传本地图片编程方法基本一致,就不过多介绍了。

/****************************upload.jsp代码**********************************/
 <% @page   import = "java.net.URLDecoder" %>
 <%@ page language= "java"  contentType= "text/html;charset=GB18030" %>
 <%@ page  import = "java.util.*" %>
 <%@ page  import = "org.apache.commons.fileupload.*" %>
 <%
 //程序:wallimn
 //时间:2008-08-27
 //电邮:wallimn@sohu.com
 //博客:http://wallimn.iteye.com、http://blog.csdn.net/wallimn
 //说明:KindEditor图片上传处理CGI,
 //注意:此程序需要commons-fileupload.jar,请自行下载放到WEB-INF/lib目录下。
 //request.setCharacterEncoding("GB18030");
 String contextPath = request.getContextPath()+ "\\" ;
 String SavePath = request.getSession().getServletContext().getRealPath( "\\")+" attached/";
 String SaveUrl = contextPath+ "/attached/" ;
 String[] ExtArr =  new  String[]{ ".gif" , ".jpg" , ".png" , ".bmp" };
 int  MaxSize =  4000000 ;
 String Msg1 =  "上传文件大小超过限制。" ;
 String Msg2 =  "上传文件的扩展名不被允许。" ; 
 String Msg3 =  "文件上传失败。" ;
 String Msg=Msg3;
 //java.io.File files=new java.io.File(".");    
 //String FileName = (String)request.getAttribute("fileName");
 String FileWidth =  null ;
 String FileHeight =  null ;
 String FileBorder =  null ;
 String FileTitle =  null ;
 String FileTitle2 =  null ;
 String FileAlign =  null ;
 String FileHspace =  null ;
 String FileVspace =  null ;

 Date dt =  new  Date();
 Random random =  new  Random();
 random.nextInt();
 String FileNameAuto = String.format( "%X_%X" , new  Object[]{ new  Integer(( int )(dt.getTime())), new  Integer(random.nextInt())});
 String FilePath =  null ;
 String FileUrl =  null ;
 DiskFileUpload fu =  new  DiskFileUpload();
 fu.setSizeMax(MaxSize); //
 fu.setSizeThreshold( 4096 );
 fu.setRepositoryPath( "c:/" );
 //ServletRequestContext src = new ServletRequestContext(request);   
 List fileItems = fu.parseRequest(request);
 Iterator iter = fileItems.iterator();
 while  (iter.hasNext()) {
     FileItem item = (FileItem) iter.next();
     String fieldName = item.getFieldName();
      if  (!item.isFormField()) {
         String name = item.getName();
          long  size = item.getSize();
          if ((name== null ||name.equals( "" )) && size== 0 )
          continue ;
          if (size>MaxSize) {
             Msg=Msg1;
              break ;
         }
          //name = name.replace(':','_');
          //name = name.replace('\\','_');
          int  pos = name.lastIndexOf( "." );
         String ext = name.substring(pos);
          boolean  b= false ;
          for ( int  m= 0 ;m<ExtArr.length; m++){
              if (ExtArr[m].equalsIgnoreCase(ext)){
                 b= true ;
                  break ;
             }
         }
          if  (b== false ){
             Msg=Msg2;
              break ;
         }
         FilePath = SavePath + FileNameAuto+ext;
         FileUrl = SaveUrl + FileNameAuto+ext;
         java.io.File f=  new  java.io.File(FilePath);
         item.write(f);
     }
      else {
         String fieldValue = item.getString();
          if ( "imgWidth" .equals(fieldName)){
             FileWidth = fieldValue;
         }
          else   if ( "imgHeight" .equals(fieldName)){
             FileHeight = fieldValue;
         }
          else   if ( "imgBorder" .equals(fieldName)){
             FileBorder = fieldValue;
         }
          else   if ( "imgTitle" .equals(fieldName)){
             FileTitle = fieldValue;
         }
          else   if ( "imgTitle2" .equals(fieldName)){
              //FileTitle2 = URLDecoder.decode(fieldValue,"GB18030");
             FileTitle2 = URLDecoder.decode(fieldValue, "UTF-8" );
         }
          else   if ( "imgAlign" .equals(fieldName)){
             FileAlign = fieldValue;
         }
          else   if ( "imgHspace" .equals(fieldName)){
             FileHspace = fieldValue;
         }
          else   if ( "imgVspace" .equals(fieldName)){
             FileVspace = fieldValue;
         }
     }
 }
 if (FileUrl!= null ){
     out.println(  "<html>" );
     out.println(  "<head>" );
     out.println(  "<title>error</title>" );
     out.println(  "<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\">" );
     out.println(  "</head>" );
     out.println(  "<body>" );
     out.println(  "<script type=\"text/javascript\">parent.KindInsertImage(\""  + FileUrl +  "\",\""  + FileWidth +  "\",\""  + FileHeight +  "\",\""  + FileBorder +  "\",\""  + FileTitle2 +  "\",\""  + FileAlign +  "\",\""  + FileHspace +  "\",\""  + FileVspace +  "\");</script>" );
     out.println(  "</body>" );
     out.println(  "</html>" );
 }
 else {
     out.println(  "<html>" );
     out.println(  "<head>" );
     out.println(  "<title>error</title>" );
     out.println(  "<meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\">" );
     out.println(  "</head>" );
     out.println(  "<body>" );
     out.println(  "<script type=\"text/javascript\">alert(\""  + Msg +  "\");parent.KindDisableMenu();parent.KindReloadIframe();</script>" );
     out.println(  "</body>" );
     out.println(  "</html>" );
 }
 %>

注:此代码在2.4KindEditor版本中测试通过。目前的最新版本为:3.1.1,其js代码变化比较大,不知还能不能用,我没有进行测试。2009-04-10

请注意:common-fileupload的版本为1.0,选用更高版本的jar,可能代码会有些变化。

/***********本人原创,欢迎转载,转载请保留本人信息*************/
作者:wallimn 电邮:wallimn@sohu.com 时间:2008-08-30
博客:http://blog.csdn.net/wallimn http://wallimn.iteye.com
网络硬盘:http://wallimn.ys168.com
/***********文章发表请与本人联系,作者保留所有权利*************/
 

2
1
分享到:
评论
5 楼 wallimn 2009-09-23  
我在网络硬盘(wallimn.ys168.com)中上传了,可以去下载一下。
4 楼 aprilsuny 2009-09-22  
我参照你的改的JSP,可是提示上传失败
原因是
List fileItems = fu.parseRequest(request);  

取出的是空值,这是什么原因呢?
3 楼 liaoshaoyao 2009-08-24  
   谢谢你, 我搞了一整天, 后来下了个3.2的, 参照你的代码搞了一个...
2 楼 wallimn 2009-08-23  
需要commons-fileupload.jar,其它没有什么了。说说你报了什么错。
1 楼 liaoshaoyao 2009-08-23  
    朋友, 帮忙呀, 我使用了你这个文件,  但是没有看到图片呀。 能说说要注意些什么不?

相关推荐

    kindeditor上传图片自动压缩过大的图片

    总的来说,实现KindEditor上传图片自动压缩过大的图片,需要结合服务器端脚本处理和合适的图像处理库。这个过程不仅可以提高网站性能,也可以帮助维护服务器资源,为用户提供更好的体验。记得在实现时考虑错误处理和...

    kindEditor+图片批量上传

    "KindEditor图片批量上传工具"是一款专为网页设计者和内容创作者打造的高效图片上传解决方案。这款工具允许用户在Web界面一次性上传多张图片,极大地提升了工作效率,特别是对于那些需要频繁处理文字和图像,比如...

    kindeditor上传图片Demo

    这个"kindeditor上传图片Demo"是一个示例项目,旨在演示如何在KindEditor中集成图片上传功能。在开发过程中,开发者可能会遇到各种问题,比如权限设置、服务器端处理、前端交互等。在这个Demo中,作者可能已经解决了...

    kindeditor图片上传携带token字段

    本文将详细讲解如何在KindEditor中实现图片上传时携带token字段,以确保数据的安全性和完整性。 首先,理解“token”在Web开发中的作用至关重要。Token通常用于验证客户端请求的合法性,防止跨站请求伪造(Cross-...

    kindeditor添加图片压缩功能(Asp.net版)

    在Asp.net环境中,为了让用户上传的图片在服务器端自动进行压缩,提高网站性能并节省存储空间,我们需要为KindEditor添加图片压缩功能。本项目是作者针对这一需求自行实现的Asp.net版本。 在Asp.net中实现图片压缩...

    kindeditor多图上传H5版

    6. **AJAX**(异步JavaScript和XML):KindEditor的H5版将使用AJAX技术,通过XMLHttpRequest对象进行异步文件上传,使得用户在上传图片时不会刷新整个页面,提供更好的用户体验。 7. **JavaScript事件处理**:在H5...

    kindEditor4.1版修改上传图片宽高(图片自适应)

    在使用kindEditor4.1版本时,我们可能会遇到一个常见的问题:上传的图片无法很好地适配不同大小的屏幕,导致在某些设备上出现拉伸或失真的现象。为了改善用户体验,我们需要实现图片自适应功能,即无论页面如何缩放...

    JSP版的完善KindEditor在线编辑器(带附件上传与图片按日期分类管理功能)

    JSP版的完善KindEditor在线编辑器(带附件上传与图片按日期分类管理功能) 1.集合了日期、时间、在线预览和特殊字符插件,采用3.0皮肤; 2.将图片上传与管理的JSP页面改写成SERVLET,同时去除JSON包; 3.添加图片压缩...

    kindeditor(jsp版)视频上传

    5. **编写服务器端处理程序**:使用七牛Java SDK,编写一个Servlet或Controller,接收KindEditor上传的视频文件,通过SDK上传到七牛云,并返回成功信息和视频URL。 6. **前端显示**:KindEditor接收到服务器返回的...

    KindEditor上传图片和管理图片

    在"KindEditor上传图片和管理图片"这个主题中,我们将探讨如何利用KindEditor实现图片的上传和管理,以及在实际应用中的一些考虑。 首先,让我们了解图片上传的基本过程。在KindEditor中,用户可以通过内置的图片...

    kindeditor上传视频、图片功能实现

    在“kindeditor上传视频、图片功能实现”中,我们将探讨如何利用KindEditor与Java后端配合,实现在网页上进行图片和视频的上传功能。 1. **KindEditor的图片上传功能**: KindEditor内建了图片上传的功能,用户...

    KindEditor图片上传相关问题

    在IT行业中,图片上传功能是网站和应用程序中常见的需求,特别是在内容编辑器如KindEditor这样的富文本编辑器中。KindEditor是一款开源的JavaScript在线编辑器,它提供了丰富的API和插件,使得用户能够方便地在网页...

    kindEditor上传图片到七牛(php版)

    - 处理文件上传:接收KindEditor上传的文件,然后使用七牛SDK上传至指定Bucket。 4. **实现七牛上传** 在`upload_qiniu.php`中,使用七牛SDK的`putFile()`或`put()`方法上传文件。上传成功后,返回七牛云存储的...

    优化kindeditor,修改flash批量上传图片方式为H5上传

    “粘贴时自动上传网络图片”是指当用户从剪贴板粘贴包含网络图片的文本时,编辑器会自动抓取这些图片并上传到服务器,然后替换为服务器上的图片链接。这需要监听编辑器的`paste`事件,解析HTML内容中的图片URL,然后...

    KindEditor-4.1.9批量上传图片完整示例(可以上传到image目录下的子目录中,可返回上一级目录,并实现了按名称、大小、类型排序的功能)

    这是本人写的一个基于KindEditor-4.1.9的Java项目,采用Struts2框架,实现了KindEditor单张图片上传、批量图片上传,可以上传到image目录下的子目录中,可返回上一级目录,并实现了按名称、大小、类型排序的功能。...

    jsp实现kindeditor在线编辑器可上传图片,附件源码献上

    4. **返回结果**: 保存文件后,服务器需要返回一个响应告知KindEditor上传的结果。如果成功,可以返回文件的URL,以便编辑器在页面上显示;如果失败,则返回错误信息。 5. **安全考虑**: 上传功能必须考虑到安全性...

    为 KindEditor 实现图片上传

    在使用 KindEditor 进行文本编辑时,一个常见的需求是实现图片上传功能,以便用户能够方便地将本地图片插入到编辑的内容中。本篇文章将详细介绍如何为 KindEditor 实现图片上传功能。 首先,我们需要理解 ...

    vue 使用kindeditor粘贴复制图片上传给自己服务器,单独图片上传

    vue 使用kindeditor粘贴复制图片上传给自己服务器,单独图片上传,避免用户到处寻找,解决了用户粘贴复制截图时候,图片变成base64,上传给后台的时候长度过于长,所以在粘贴的时候就上传给服务器,最后以形式显示在富...

    ASP在线编辑器 可本地上传图片 kindeditor

    在实际应用中,开发者需要将这些文件部署到服务器,并配置好相应的上传路径和权限,以便于KindEditor能够正常工作并实现图片的本地上传。同时,根据项目需求,可能还需要对编辑器的默认设置进行调整,以满足特定的...

    kindeditor(带压缩图片功能)

    然而,原始的KindEditor可能并不直接支持图片上传后的压缩,这可能导致用户上传大尺寸图片时,服务器存储空间消耗过大,网页加载速度变慢等问题。 描述中提到的“带压缩图片功能”,意味着这个版本的KindEditor已经...

Global site tag (gtag.js) - Google Analytics