在博客中看到了一位大侠的ckeidtor的图片上传的servlet实现,写的很好,也给了我思路,但是图片上传后,是自动保存在了tomcat的服务器上的,对于图片的管理有些不方便,现对代码进行一些改进,支持将图片放在指定的目录下。
首先在ckeidtor的配置文件config.js中将上传配置打开:脚本如下:
config.filebrowserImageUploadUrl = '../CKEditorImageServlet?Type=Image';
然后就是web.xml文件的配置了:
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
<servlet>
<servlet-name>CKEditorImageServlet</servlet-name>
<servlet-class>com.jabberchina.poms.servlet.CKEditorImageServlet</servlet-class>
<init-param>
<param-name>allowedImageExtensions</param-name>
<param-value>jpg|gif|jpeg|png|bmp</param-value>
</init-param>
<load-on-startup>0</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>CKEditorImageServlet</servlet-name>
<url-pattern>/CKEditorImageServlet</url-pattern>
</servlet-mapping>
<session-config>
<session-timeout>30</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
主要是Servlet文件上传的扩展名规则,就是允许上传的类型和阻止上传的类型。与要拦截的URL。
下面就是Servlet的实现了:
package com.servlet;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.io.PrintWriter;
import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.commons.io.FilenameUtils;
import org.springframework.context.ApplicationContext;
import org.springframework.web.context.support.WebApplicationContextUtils;
import com.dao.CkeditorImageDAO;
public class CKEditorImageServlet extends HttpServlet {
/**
*
*/
private static final long serialVersionUID = -735481391001655214L;
private CkeditorImageDAO ckeditorImageDAO;
/**
* Servlet初始化方法
*/
public void init() throws ServletException {
ApplicationContext ac = WebApplicationContextUtils
.getRequiredWebApplicationContext(getServletContext());
ckeditorImageDAO = (CkeditorImageDAO) ac.getBean("ckeditorImageDAO");
}
public void destroy() {
ckeditorImageDAO = null;
}
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
String fileName = request.getParameter("fileName");
String extensionName = FilenameUtils.getExtension(fileName);
response.setContentType("image/" + extensionName);
BufferedImage bufferImage = ckeditorImageDAO.getFromDisk(fileName);
ImageIO.write(bufferImage, extensionName, response.getOutputStream());
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html; charset=UTF-8");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = response.getWriter();
String imageURL = "";
try {
imageURL = ckeditorImageDAO.saveTODisk(request);
} catch (Exception e) {
e.printStackTrace();
}
// CKEditorFuncNum是回调时显示的位置,这个参数必须有
String callback = request.getParameter("CKEditorFuncNum");
out.println("<script type=\"text/javascript\">");
out.println("window.parent.CKEDITOR.tools.callFunction(" + callback
+ ",'" + imageURL + "',''" + ");");
out.println("</script>");
out.flush();
out.close();
}
}
package com.dao.impl;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.IOException;
import java.util.Date;
import java.util.List;
import javax.imageio.ImageIO;
import javax.servlet.http.HttpServletRequest;
import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.apache.commons.io.FilenameUtils;
import com.dao.CkeditorImageDAO;
public class CkeditorImageDAOImpl implements CkeditorImageDAO{
private String dataFilePath;
private String ckeditorImageServletPath;
public String getCkeditorImageServletPath() {
return ckeditorImageServletPath;
}
public void setCkeditorImageServletPath(String ckeditorImageServletPath) {
this.ckeditorImageServletPath = ckeditorImageServletPath;
}
public String getDataFilePath() {
return dataFilePath;
}
public void setDataFilePath(String dataFilePath) {
this.dataFilePath = dataFilePath;
}
@SuppressWarnings("unchecked")
public String saveTODisk(HttpServletRequest request) throws Exception {
String imageURL = "";
// 判断文件夹是否存在,不存在则创建
File dirTest = new File(dataFilePath);
if (!dirTest.exists()) {
dirTest.mkdirs();
}
ServletFileUpload upload = new ServletFileUpload(
new DiskFileItemFactory());
try {
List<FileItem> items = upload.parseRequest(request);
if (items != null && !items.isEmpty()) {
FileItem fileItem = items.get(0);//目前ckeditor编辑器只允许同时上传一个图片文件,所以只处理第一个即可
String fileName = new Date().getTime() + "."
+ FilenameUtils.getExtension(fileItem.getName());//获取文件扩展名
File pathToSave = new File(dataFilePath, fileName);
fileItem.write(pathToSave);
imageURL = this.ckeditorImageServletPath + fileName;
}
} catch (Exception ex) {
throw ex;
}
return imageURL;
}
public BufferedImage getFromDisk(String fileName) throws IOException {
File file = new File(dataFilePath + fileName);
BufferedImage bufferImage = ImageIO.read(file);
return bufferImage;
}
}
dataFilePath为图片要上传到磁盘路径:如为:D:/poms_workspace/upload/
ckeditorImageDAO与ckeditorImageServletPath 需要在spring的配置文件中进行配置:
<bean id="ckeditorImageDAO" name="ckeditorImageDAO"
class="com.jabberchina.poms.dao.impl.CkeditorImageDAOImpl" scope="prototype">
<property name="dataFilePath" value="${dataFilePath}"></property>
<property name="ckeditorImageServletPath" value="../CKEditorImageServlet?fileName="></property>
</bean>
package com.dao;
import java.awt.image.BufferedImage;
import java.io.IOException;
import javax.servlet.http.HttpServletRequest;
public interface CkeditorImageDAO {
public String saveTODisk(HttpServletRequest request) throws Exception;
public BufferedImage getFromDisk(String fileName) throws IOException;
}
此servlet实现写在了一个servlet中,可以分别写两个servlet,一个是上传图片,一个是读取图片。在此取了个巧,因为上传文件时,是以表单的方式post上去的,所以写在doPost方法中,而对于图片的读取我们用的是"URL?fileName="的get形式发送的请求,所以写在了doGet方法中实现。
分享到:
相关推荐
CKEditor提供了丰富的文本格式化选项,如字体、大小、颜色、对齐方式等,以及插入图片、链接和多媒体功能。在"ckeditor 图片图片本地上传"这个主题中,我们将深入探讨如何在CKEditor中实现图片的本地上传功能,这...
`ckeditor`提供了丰富的文本编辑功能,包括字体、字号、颜色、对齐方式等设置,以及插入图片、链接、表格等操作。它通过HTML和JavaScript实现,可以通过下载官方提供的SDK,按照其文档说明进行集成到你的JAVA项目中...
CKeditor是一款广泛使用的开源富文本编辑器,它提供了丰富的文本格式化选项,如字体、字号、颜色、对齐方式等,还支持插入图片、链接、表格等功能。CKeditor v3.2.1是其历史版本之一,尽管现在有更高级的版本,但这...
在本文中,我们将深入探讨如何在Java环境下,利用JSP(JavaServer Pages)和CKEditor实现图片上传功能。CKEditor是一款流行的富文本编辑器,它为网页内容编辑提供了丰富的功能,包括图片上传。我们将从标题和描述中...
CKEditor本身是一个JavaScript库,通过在前端创建一个可编辑的区域,用户可以在此区域内输入文本、插入图片等。当用户选择上传图片时,CKEditor会通过Ajax或表单提交方式将图片数据发送到服务器端。因此,实现图片...
Ckeditor是一款强大的富文本编辑器,广泛应用于网页内容编辑,它支持多种功能,包括插入图片。Servlet是Java Web开发中的一个重要组件,用于处理HTTP请求和响应,非常适合用来处理文件上传这样的任务。 ### 1. ...
在IT行业中,富文本编辑器CKEditor 4是一款广泛应用的在线文本编辑工具,它提供了丰富的功能,如格式化、图片上传、链接插入等,极大地提升了用户在网页上的文本编辑体验。"ckeditor4添加上传视频插件"这个主题,是...
文件路径可能会被编码并返回给CKEditor,以便在编辑器中插入图片。 `uploader`目录可能包含了一个或多个处理上传请求的Servlet或者Controller,它们接收来自CKEditor的POST请求,调用`FileUploadUtil`进行文件处理...
6. **编辑器更新**:CKEditor接收到响应后,根据返回的URL在编辑器内插入图片。 对于Flash文件的上传,其流程基本与图片上传相似,只是处理的文件类型不同。CKEditor同样提供了一个Flash插入工具,用户可以选择本地...
这个功能极大地提升了在线文档编辑的效率,特别是对于需要频繁插入图片的场景,如编写博客、论坛发帖等。 屏幕截图功能通常依赖于操作系统或者浏览器的API,例如Windows系统的Print Screen键或者浏览器的Web ...
总结起来,这个教程将指导你如何配置CKEditor3.x以支持图片上传,包括集成CKEditor、配置图片上传的URL、设置FTP服务器、编写处理图片上传的Servlet,以及在实际项目中应用这些配置。通过学习和实践这个教程,你将...
这样,当用户在ckeditor中点击“插入图片”或“插入链接”时,ckfinder会弹出,用户可以选择本地文件进行上传。 文件上传功能的实现通常涉及服务器端的处理,例如使用Servlet。在JSP中,可以通过表单提交的方式触发...
在CKEditor中,用户可以插入图片、文件或其他媒体内容,而上传功能就是实现这一需求的关键。它允许用户从本地选择文件,并将其上传到服务器。这个例子提供了如何在Java后端与JSP前端结合使用CKEditor实现文件上传的...
- Java集成:虽然CKEditor主要是JavaScript实现,但可以通过Java在服务器端处理CKEditor提交的数据,例如使用Java Servlet或Spring MVC框架来接收和处理编辑器内容。 - Java API:CKEditor可以与Java应用进行交互...
为了进一步提高用户体验,你还可以实现上传图片功能。CKEditor支持文件上传,你需要在服务器端设置一个接收文件的接口。例如,你可以创建一个Servlet来处理上传请求,并将文件保存到服务器。同时,确保在CKEditor...
"ckeditor-java-core-3.5.3"是CKEditor的Java版,它使得Java开发者能够将CKEditor的富文本编辑功能引入到Java Web应用中,如Servlet、JSP、Spring MVC等框架。这个版本可能包含了Java API、库文件和其他必要的资源...
CKEditor是一款流行的开源富文本编辑器,广泛应用于网页内容编辑,它提供了丰富的文本格式化选项、图片处理、链接插入等功能。CKEditor以其易用性、可定制性和跨浏览器兼容性著称,支持多种编程语言环境,如...
1. **富文本编辑**:支持插入图片、链接、表格、列表等HTML元素,提供多种预设样式。 2. **格式化工具**:如加粗、斜体、下划线、字体大小和颜色调整等。 3. **撤销/重做**:方便用户快速修正误操作。 4. **源代码...
为了增强其功能,CKEditor通常会集成文件上传功能,让用户能够方便地在编辑器中插入本地图片或文件。在Java后端,我们需要编写特定的类来处理这些文件上传请求。下面我们将详细讨论CKEditor文件上传的Java实现以及...
CKEditor是一款广泛使用的富文本编辑器,它允许用户在网页上创建和编辑内容,包括插入图片、文件等。在Java Web开发中,实现CKEditor的文件上传功能通常涉及到后端服务器的处理,例如使用JSP(JavaServer Pages)来...