AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

Fckeditor中使用图片上传

2022-05-17 145
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 本文主要讲Fckeditor中使用图片上传

今天在做项目又碰到Fckeditor上传图片，于是花了点时间把这个功能实现了。

Fckeditor的使用方法之前已经介绍过了，不知道的可以看我之前的文章：

http://blog.csdn.net/v123411739/article/details/24500675


Fckeditor使用文件上传：


1.把相关jar包添加到项目中


所需jar包为下图的5个jar包，其中第三个为Fckeditor的核心包，全名应该叫fckeditor-java-core-2.4.jar


image.png

<servlet>
  <servlet-name>Connector</servlet-name>
  <servlet-class>com.grace.mycrm.util.ConnectorServlet</servlet-class>
  <load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping> 
  <servlet-name>Connector</servlet-name>
  <url-pattern>/fckeditor/editor/filemanager/connectors/*</url-pattern>
</servlet-mapping>

关联的servlet-class如下

1.


fckeditor.properties的内容：


connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl


3.在web.xml中配置一个接收上传文件的 ConnectorServlet


package com.grace.mycrm.util;
/*
 * FCKeditor - The text editor for Internet - http://www.fckeditor.net
 * Copyright (C) 2003-2008 Frederico Caldeira Knabben
 * 
 * == BEGIN LICENSE ==
 * 
 * Licensed under the terms of any of the following licenses at your
 * choice:
 * 
 *  - GNU General Public License Version 2 or later (the "GPL")
 *    http://www.gnu.org/licenses/gpl.html
 * 
 *  - GNU Lesser General Public License Version 2.1 or later (the "LGPL")
 *    http://www.gnu.org/licenses/lgpl.html
 * 
 *  - Mozilla Public License Version 1.1 or later (the "MPL")
 *    http://www.mozilla.org/MPL/MPL-1.1.html
 * 
 * == END LICENSE ==
 */
import java.io.File;
import java.io.IOException;
import java.io.PrintWriter;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.List;
import java.util.UUID;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.fckeditor.connector.Messages;
import net.fckeditor.handlers.CommandHandler;
import net.fckeditor.handlers.ConnectorHandler;
import net.fckeditor.handlers.ExtensionsHandler;
import net.fckeditor.handlers.RequestCycleHandler;
import net.fckeditor.handlers.ResourceTypeHandler;
import net.fckeditor.response.UploadResponse;
import net.fckeditor.response.XmlResponse;
import net.fckeditor.tool.Utils;
import net.fckeditor.tool.UtilsFile;
import net.fckeditor.tool.UtilsResponse;
import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.FileItemFactory;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.apache.commons.io.FilenameUtils;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
/**
 * Servlet to upload and browse files.<br />
 * 
 * This servlet accepts 4 commands which interact with the server-side filesystem.<br />
 * The allowed commands are:
 * <ul>
 * <li><code>GetFolders</code>: Retrieves a list of folders in the current folder</li>
 * <li><code>GetFoldersAndFiles</code>: Retrives a list of files and folders in the current
 * folder</li>
 * <li><code>CreateFolder</code>: Creates a new folder in the current folder</li>
 * <li><code>FileUpload</code>: Stores an uploaded file into the current folder. (must be sent
 * with POST)</li>
 * </ul>
 * 
 * @version $Id: ConnectorServlet.java 2101 2008-06-22 22:00:48Z mosipov $
 */
public class ConnectorServlet extends HttpServlet {
  private static final long serialVersionUID = -5742008970929377161L;
  private static final Logger logger = LoggerFactory.getLogger(ConnectorServlet.class);
  /**
   * Initialize the servlet: <code>mkdir</code> <DefaultUserFilesPath>
   */
  public void init() throws ServletException, IllegalArgumentException {
    String realDefaultUserFilesPath = getServletContext().getRealPath(
        ConnectorHandler.getDefaultUserFilesPath());
    File defaultUserFilesDir = new File(realDefaultUserFilesPath);
    UtilsFile.checkDirAndCreate(defaultUserFilesDir);
    logger.info("ConnectorServlet successfully initialized!");
  }
  /**
   * Manage the <code>GET</code> requests (<code>GetFolders</code>,
   * <code>GetFoldersAndFiles</code>, <code>CreateFolder</code>).<br/>
   * 
   * The servlet accepts commands sent in the following format:<br/>
   * <code>connector?Command=<CommandName>&Type=<ResourceType>&CurrentFolder=<FolderPath></code>
   * <p>
   * It executes the commands and then returns the result to the client in XML format.
   * </p>
   */
  public void doGet(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
    logger.debug("Entering ConnectorServlet#doGet");
    response.setCharacterEncoding("UTF-8");
    response.setContentType("application/xml; charset=UTF-8");
    response.setHeader("Cache-Control", "no-cache");
    PrintWriter out = response.getWriter();
    String commandStr = request.getParameter("Command");
    String typeStr = request.getParameter("Type");
    String currentFolderStr = request.getParameter("CurrentFolder");
    // 解决中文乱码问题
    currentFolderStr = new String(currentFolderStr.getBytes("iso8859-1"), "utf-8");
    logger.debug("Parameter Command: {}", commandStr);
    logger.debug("Parameter Type: {}", typeStr);
    logger.debug("Parameter CurrentFolder: {}", currentFolderStr);
    XmlResponse xr;
    if (!RequestCycleHandler.isEnabledForFileBrowsing(request))
      xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.NOT_AUTHORIZED_FOR_BROWSING);
    else if (!CommandHandler.isValidForGet(commandStr))
      xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.INVALID_COMMAND);
    else if (typeStr != null && !ResourceTypeHandler.isValid(typeStr))
      xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.INVALID_TYPE);
    else if (!UtilsFile.isValidPath(currentFolderStr))
      xr = new XmlResponse(XmlResponse.EN_ERROR, Messages.INVALID_CURRENT_FOLDER);
    else {
      CommandHandler command = CommandHandler.getCommand(commandStr);
      ResourceTypeHandler resourceType = ResourceTypeHandler.getDefaultResourceType(typeStr);
      String typeDirPath = null;
      if ("File".equals(typeStr)) {
        // 文件所存放的路径为 ${application.path}/WEB-INF/userfiles/
        typeDirPath = getServletContext().getRealPath("WEB-INF/userfiles/");
      }
      else {
        String typePath = UtilsFile.constructServerSidePath(request, resourceType);
         typeDirPath = getServletContext().getRealPath(typePath);
      }
      File typeDir = new File(typeDirPath);
      UtilsFile.checkDirAndCreate(typeDir);
      File currentDir = new File(typeDir, currentFolderStr);
      if (!currentDir.exists())
        xr = new XmlResponse(XmlResponse.EN_INVALID_FOLDER_NAME);
      else {
        xr = new XmlResponse(command, resourceType, currentFolderStr, UtilsResponse
            .constructResponseUrl(request, resourceType, currentFolderStr, true,
                ConnectorHandler.isFullUrl()));
        if (command.equals(CommandHandler.GET_FOLDERS))
          xr.setFolders(currentDir);
        else if (command.equals(CommandHandler.GET_FOLDERS_AND_FILES))
          xr.setFoldersAndFiles(currentDir);
        else if (command.equals(CommandHandler.CREATE_FOLDER)) {
          String tempStr = request.getParameter("NewFolderName");
          tempStr = new String(tempStr.getBytes("iso8859-1"), "UTF-8");
          String newFolderStr = UtilsFile.sanitizeFolderName(tempStr);
          logger.debug("Parameter NewFolderName: {}", newFolderStr);
          File newFolder = new File(currentDir, newFolderStr);
          int errorNumber = XmlResponse.EN_UKNOWN;
          if (newFolder.exists())
            errorNumber = XmlResponse.EN_ALREADY_EXISTS;
          else {
            try {
              errorNumber = (newFolder.mkdir()) ? XmlResponse.EN_OK
                  : XmlResponse.EN_INVALID_FOLDER_NAME;
            } catch (SecurityException e) {
              errorNumber = XmlResponse.EN_SECURITY_ERROR;
            }
          }
          xr.setError(errorNumber);
        }
      }
    }
    out.print(xr);
    out.flush();
    out.close();
    logger.debug("Exiting ConnectorServlet#doGet");
  }
  /**
   * Manage the <code>POST</code> requests (<code>FileUpload</code>).<br />
   * 
   * The servlet accepts commands sent in the following format:<br />
   * <code>connector?Command=<FileUpload>&Type=<ResourceType>&CurrentFolder=<FolderPath></code>
   * with the file in the <code>POST</code> body.<br />
   * <br>
   * It stores an uploaded file (renames a file if another exists with the same name) and then
   * returns the JavaScript callback.
   */
  @SuppressWarnings("unchecked")
  public void doPost(HttpServletRequest request, HttpServletResponse response)
      throws ServletException, IOException {
    logger.debug("Entering Connector#doPost");
    response.setCharacterEncoding("UTF-8");
    response.setContentType("text/html; charset=UTF-8");
    response.setHeader("Cache-Control", "no-cache");
    PrintWriter out = response.getWriter();
    String commandStr = request.getParameter("Command");
    String typeStr = request.getParameter("Type");
    String currentFolderStr = request.getParameter("CurrentFolder");
    logger.debug("Parameter Command: {}", commandStr);
    logger.debug("Parameter Type: {}", typeStr);
    logger.debug("Parameter CurrentFolder: {}", currentFolderStr);
    UploadResponse ur;
    // if this is a QuickUpload request, 'commandStr' and 'currentFolderStr'
    // are empty
    if (Utils.isEmpty(commandStr) && Utils.isEmpty(currentFolderStr)) {
      commandStr = "QuickUpload";
      currentFolderStr = "/";
    }
    if (!RequestCycleHandler.isEnabledForFileUpload(request))
      ur = new UploadResponse(UploadResponse.SC_SECURITY_ERROR, null, null,
          Messages.NOT_AUTHORIZED_FOR_UPLOAD);
    else if (!CommandHandler.isValidForPost(commandStr))
      ur = new UploadResponse(UploadResponse.SC_ERROR, null, null, Messages.INVALID_COMMAND);
    else if (typeStr != null && !ResourceTypeHandler.isValid(typeStr))
      ur = new UploadResponse(UploadResponse.SC_ERROR, null, null, Messages.INVALID_TYPE);
    else if (!UtilsFile.isValidPath(currentFolderStr))
      ur = UploadResponse.UR_INVALID_CURRENT_FOLDER;
    else {
      ResourceTypeHandler resourceType = ResourceTypeHandler.getDefaultResourceType(typeStr);
      String typeDirPath = null;
      if ("File".equals(typeStr)) {
        // 文件所存放的路径为 ${application.path}/WEB-INF/userfiles/
        typeDirPath = getServletContext().getRealPath("WEB-INF/userfiles/");
      }
      else {
        String typePath = UtilsFile.constructServerSidePath(request, resourceType);
        typeDirPath = getServletContext().getRealPath(typePath);
      }
      File typeDir = new File(typeDirPath);
      UtilsFile.checkDirAndCreate(typeDir);
      File currentDir = new File(typeDir, currentFolderStr);
      if (!currentDir.exists())
        ur = UploadResponse.UR_INVALID_CURRENT_FOLDER;
      else {
        String newFilename = null;
        FileItemFactory factory = new DiskFileItemFactory();
        ServletFileUpload upload = new ServletFileUpload(factory);
        upload.setHeaderEncoding("UTF-8");
        try {
          List<FileItem> items = upload.parseRequest(request);
          // We upload only one file at the same time
          FileItem uplFile = items.get(0);
          String rawName = UtilsFile.sanitizeFileName(uplFile.getName());
          String filename = FilenameUtils.getName(rawName);
          String baseName = FilenameUtils.removeExtension(filename);
          String extension = FilenameUtils.getExtension(filename);
          // 如果这个文件的扩展名不允许上传
          if (!ExtensionsHandler.isAllowed(resourceType, extension)) {
            ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION);
          }
          // 如果文件大小超出限制
          else if (uplFile.getSize() > 1024 * 1024 * 3) {
            // 传递一个自定义的错误码
            ur = new UploadResponse(204);
          }
          // 如果不存在以上情况, 则 保存文件
          else {
            // construct an unique file name
            // 使用 UUID 做为文件名, 并放到按照日期生成的文件夹中
            filename = UUID.randomUUID().toString() + "." + extension;
            filename = makeFileName(currentDir.getPath(), filename); 
            File pathToSave = new File(currentDir, filename);
            int counter = 1;
            while (pathToSave.exists()) {
              newFilename = baseName.concat("(").concat(String.valueOf(counter))
                  .concat(")").concat(".").concat(extension);
              pathToSave = new File(currentDir, newFilename);
              counter++;
            }
            if (Utils.isEmpty(newFilename))
              ur = new UploadResponse(UploadResponse.SC_OK, UtilsResponse
                  .constructResponseUrl(request, resourceType, currentFolderStr,
                      true, ConnectorHandler.isFullUrl()).concat(filename));
            else
              ur = new UploadResponse(UploadResponse.SC_RENAMED,
                  UtilsResponse.constructResponseUrl(request, resourceType,
                      currentFolderStr, true, ConnectorHandler.isFullUrl())
                      .concat(newFilename), newFilename);
            // secure image check
            if (resourceType.equals(ResourceTypeHandler.IMAGE)
                && ConnectorHandler.isSecureImageUploads()) {
              if (UtilsFile.isImage(uplFile.getInputStream()))
                uplFile.write(pathToSave);
              else {
                uplFile.delete();
                ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION);
              }
            }
            else
              uplFile.write(pathToSave);
          }
        } catch (Exception e) {
          ur = new UploadResponse(UploadResponse.SC_SECURITY_ERROR);
        }
      }
    }
    out.print(ur);
    out.flush();
    out.close();
    logger.debug("Exiting Connector#doPost");
  }
  /**
   * 
   */
  private static SimpleDateFormat sdf = new SimpleDateFormat("yyyy/MM/dd");
  public static String makeFileName(String basePath, String filename) {
    String subPath = sdf.format(new Date());
    File dir = new File(basePath + "/" + subPath);
    // 如果目录不存在, 就递归的创建, 已存在则不会重新创建
    if (!dir.exists()) {
      if (!dir.mkdirs()) {
        throw new IllegalStateException("创建目录失败:" + dir.getPath());
      }
    }
    String uuid = UUID.randomUUID().toString();
    String extension = FilenameUtils.getExtension(filename);
    return subPath + "/" + uuid + "." + extension;
  }
}

如果项目使用了strust2的过滤器，需要将

<filter>
  <filter-name>struts2</filter-name>
  <filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
</filter>
<filter-mapping>
       <filter-name>struts2</filter-name>
       <url-pattern>/*</url-pattern>
</filter-mapping>

中的filter-mapping进行更改，否则Fckeditor在上传图片时会被拦截，显示没有权限。

<filter-mapping>
    <filter-name>struts2</filter-name>
    <url-pattern>*.action</url-pattern>
</filter-mapping>
<filter-mapping>
    <filter-name>struts2</filter-name>
    <url-pattern>*.do</url-pattern>
</filter-mapping>
<filter-mapping>
    <filter-name>struts2</filter-name>
    <url-pattern>*.jsp</url-pattern>
</filter-mapping>
<filter-mapping>
    <filter-name>struts2</filter-name>
    <url-pattern>*.js</url-pattern>
</filter-mapping>

不过此处只有当你的这个项目的struts2中配置了扩展名才可以使用，否则就需要用其他的方法，来让struts2过滤器不过滤fckeditor上传图片。

文章标签：
Java
程序员囧辉
目录
相关文章
daotianmi
|
7月前
|
小程序 JavaScript
在使用微信小程序开发中用vant2框架中的Uploader 文件上传wx.uploadFile无反应和使用多图上传
网上有的说是bind:after-read="afterRead"的命名问题不支持-，但是我这儿执行了console.log("file",file);证明函数运行了。后来发现是multiple="true"原因开启了多图上传，如果是多图上传的话file就是数组了
daotianmi
455 2
java开发-郭老师
|
7月前
|
JavaScript Java
EasyUi 图片上传
EasyUi 图片上传
java开发-郭老师
55 0
破浪前进
|
7月前
UEditor上传图片成功但回显不出来
UEditor上传图片成功但回显不出来
破浪前进
182 1
海拥
|
存储 Java Linux
项目之关于Summernote的图片处理和基于SpringMVC的文件上传(11)
项目之关于Summernote的图片处理和基于SpringMVC的文件上传(11)
海拥
301 0
海拥
|
JavaScript 前端开发 Java
项目之关于Summernote的图片处理和基于SpringMVC的文件上传(10)
项目之关于Summernote的图片处理和基于SpringMVC的文件上传(10)
海拥
155 0
mcy247
|
JavaScript 前端开发
文件上传~Uploadify上传控件~续(多文件上传)
mcy247
1518 0
mcy247
|
JavaScript 内存技术
文件上传~Uploadify上传控件
mcy247
1525 0
橘子红了呐
UI upload 多文件上传
橘子红了呐
1019 0
技术小胖子
|
JavaScript 前端开发 PHP
Uploadify多上传图片插件
技术小胖子
1369 0
技术小胖子
|
Java 数据可视化 内存技术
解决kindeditor上传图片、文件的错误。
技术小胖子
2596 0

热门文章

最新文章

  • 1
    跟阿里云技术专家阙寒一起深度了解视频直播CDN技术
  • 2
    流批一体的近实时数仓的思考与设计
  • 3
    丰富、连接、待集成—MaxCompute 生态再出发
  • 4
    securecrt克隆会话与sshd 的 MaxSessions
  • 5
    Flink 消息聚合处理方案
  • 6
    VMware安装的相关文章
  • 7
    forever让nodejs应用后台执行
  • 8
    路边的烧烤摊杂感
  • 9
    size_type、size_t、differentce_type以及ptrdiff_t
  • 10
    一些链接
  • 1
    《人工智能知识图谱构建与应用的最新突破与成果》
    38
  • 2
    《零样本学习：突破瓶颈，开启智能新征程》
    26
  • 3
    《知识表示：开启人工智能学习与推理的密钥》
    27
  • 4
    《信息传播：人工智能助力驱散虚假信息阴霾》
    28
  • 5
    《多模态融合：开启智能新时代的钥匙》
    36
  • 6
    自学记录鸿蒙 API 13：实现人脸检测 Core Vision Face Detector
    66
  • 7
    阿里云先知安全沙龙(武汉站) ——AI赋能软件漏洞检测，机遇, 挑战与展望
    515
  • 8
    在线使用：Poe Ai网页版_pc版_poe ai中文官网入口
    22
  • 9
    java项目中jar启动执行日志报错：no main manifest attribute, in /www/wwwroot/snow-server/z-server.jar-jar打包的大小明显小于正常大小如何解决
    39
  • 10
    新手指南：人工智能poe ai 怎么用？国内使用poe记住这个方法就够了！
    34

    • 相关电子书

    更多
  • 低代码开发师（初级）实战教程
  • 冬季实战营第三期：MySQL数据库进阶实战
  • 阿里巴巴DevOps 最佳实践手册
    • 下一篇
    手把手教你白嫖阿里云服务器(免费领服务器)