JavaWeb-10 (项目案例7 文件上传与富文本编辑器)

一.Web文件上传与下载
① 概述
将本地文件上传到服务器端，从服务器端下载文件到本地的过程。例如目前网站需要上传头像、上传下载图片或网盘等功能都是利用文件上传下载功能实现的。

② 原理
(1) 文件上传

1.1 客户端浏览器通过文件浏览框，选择需要上传的文件内容（其中包括文件路径及文件内容）。
1.2 客户端浏览器通过点击上传按钮，将本地文件上传到服务器端。
1.3 服务器端通过程序接收本地文件内容，并将其保存在服务器端磁盘中。

(2) 文件下载

1.1 客户端浏览器通过点击下载按钮，将服务器端保存的文件下载到本地磁盘。
1.2 服务器端通过程序将服务器端文件响应给客户端。

③ 实现方式
(1) SmartUpload组件
(2) Apache CommonsFileUpload组件
(3) Servlet 3.0 文件上传

④ SmartUpload组件使用
(1) 核心类

1.1 SmartUpload

① 概述

该类完成上传下载工作。

② 上传文件的使用方法

public final void initialize(javax.servlet.jsp.PageContext pageContext)
（1）执行上传下载的初始化工作，必须第一个执行。
（2）pageContext为JSP页面内置对象（页面上下文）
public void upload()
（1）上传文件数据。对于上传操作，第一步执行initialize方法，第二步就要执行这个方法。
public int save(String destPathName)
（1）将全部上传文件保存到指定目录下，并返回保存的文件个数。
public int save(String destPathName,int option)
// 将全部上传文件保存到指定目录下，并返回保存的文件个数。
// option：
// SAVE_PHYSICAL指示组件将文件保存到以操作系统根目录为文件根目录的目录下
// AVE_VIRTUAL指示组件将文件保存到以Web应用程序根目录为文件根目录的目录下
// SAVE_AUTO则表示由组件自动选择
public Files getFiles()
// 取全部上传文件，以Files对象形式返回，可以利用Files类的操作方法来获得上传文件的数目等信息
public Request getRequest()
// 取得Request对象，以便由此对象获得上传表单参数之值。
public void setAllowedFilesList(String allowedFilesList)
// 设定允许上传带有指定扩展名的文件，当上传过程中有文件名不允许时，组件将抛出异常
public void setDeniedFilesList(String deniedFilesList)
// 用于限制上传那些带有指定扩展名的文件。若有文件扩展名被限制，则上传时组件将抛出异常。
public void setMaxFileSize(long maxFileSize)
// 设定每个文件允许上传的最大长度。
public void setTotalMaxFileSize(long totalMaxFileSize)
// 设定允许上传的文件的总长度，用于限制一次性上传的数据量大小。
③ 下载文件的常用方法

public void setContentDisposition(String contentDisposition)
** 将数据追加到MIME文件头的CONTENT-DISPOSITION域。jspSmartUpload组件会在返回下载的信息时自动填写MIME文件头的CONTENT-DISPOSITION域，如果用户需要添加额外信息，请用此方法。

downloadFile 下载文件

① public void downloadFile(String sourceFilePathName)
   // 其中，sourceFilePathName为要下载的文件名（带目录的文件全名）
② public void downloadFile(String sourceFilePathName,String contentType)
   // 其中，sourceFilePathName为要下载的文件名（带目录的文件全名）,contentType为内容类型（MIME格式的文件类型信息，可被浏览器识别）。
③ public void downloadFile(String sourceFilePathName,String contentType,String destFileName)
   // 其中，sourceFilePathName为要下载的文件名（带目录的文件全名）,contentType为内容类型（MIME格式的文件类型信息，可被浏览器识别）,destFileName为下载后默认的另存文件名。
1.2 Files

① 概述

这个类表示所有上传文件的集合，通过它可以得到上传文件的数目、大小等信息。

② 常用方法

public int getCount()
   // 取得上传文件的数目。
public File getFile(int index)。其中，index为指定位移，其值在0到getCount()-1之间。
   // 取得指定位移处的文件对象File（这是com.jspsmart.upload.File，不是java.io.File，注意区分）。
public long getSize()
   // 取得上传文件的总长度，可用于限制一次性上传的数据量大小。
public Collection getCollection()
   // 将所有上传文件对象以Collection的形式返回，以便其它应用程序引用，浏览上传文件信息。
public Enumeration getEnumeration()
   // 将所有上传文件对象以Enumeration（枚举）的形式返回，以便其它应用程序浏览上传文件信息。
1.3 File

① 概述

这个类包装了一个上传文件的所有信息。通过它，可以得到上传文件的文件名、文件大小、扩展名、文件数据等信息。

② 常用方法

public void saveAs(java.lang.String destFilePathName) 或public void saveAs(java.lang.String destFilePathName, int optionSaveAs)
   // destFilePathName是另存的文件名
   // optionSaveAs
       // SAVEAS_PHYSICAL表明以操作系统的根目录为文件根目录另存文件
       // SAVEAS_VIRTUAL表明以Web应用程序的根目录为文件根目录另存文件
       // SAVEAS_AUTO则表示让组件决定，当Web应用程序的根目录存在另存文件的目录时，它会选择SAVEAS_VIRTUAL，否则会选择SAVEAS_PHYSICAL
public boolean isMissing()
   // 这个方法用于判断用户是否选择了文件，也即对应的表单项是否有值。选择了文件时，它返回false。未选文件时，它返回true。
public String getFieldName()
   // 取HTML表单中对应于此上传文件的表单项的名字。
public String getFileName()
   // 取文件名（不含目录信息）
public String getFilePathName
   // 取文件全名（带目录）
public String getFileExt()
   // 取文件扩展名（后缀）
public int getSize()
   // 取文件长度（以字节计）
public byte getBinaryData(int index)。其中，index表示位移，其值在0到getSize()-1之间。
   // 取文件数据中指定位移处的一个字节，用于检测文件等处理。
1.4 Request

① 概述

这个类的功能等同于JSP内置的对象request。只所以提供这个类，是因为对于文件上传表单，通过request对象无法获得表单项的值，必须通过jspSmartUpload组件提供的Request对象来获取。

② 常用方法

public String getParameter(String name)。其中，name为参数的名字。
   // 获取指定参数之值。当参数不存在时，返回值为null。

public String[] getParameterValues(String name)。其中，name为参数的名字。
   // 当一个参数可以有多个值时，用此方法来取其值。它返回的是一个字符串数组。当参数不存在时，返回值为null。
public Enumeration getParameterNames()
   // 取得Request对象中所有参数的名字，用于遍历所有参数。它返回的是一个枚举型的对象
(2) 注意事项

1.1 表单请求方式必须为POST
1.2 设置enctype="multipart/form-data"，专用于文件传输
1.3 文件标签需设置name属性

⑤ 文件上传案例
<form action = "doAddFile.jsp" enctype="multipart/form-data" method = "post">
       <input type = "file" name = "file"/>
       <input type = "submit" value = "上传"/>
</form>

<%
   //声明并实例化SmartUpload对象
   SmartUpload su = new SmartUpload();
   su.initialize(pageContext);//初始化SmartUpload对象

   //定义文件上传类型
   String allowed = "gif,jpg,doc,rar";
   //定义不许上传类型
   String denied = "jsp,asp,php,aspx,html,htm,exe,bat";
   //设置上传文件大小
   int file_size = 10*1024*1024;
   File file = null;
   try{
       //定义允许上传文件类型
       su.setAllowedFilesList(allowed);
       //不允许上传文件类型
       su.setDeniedFilesList(denied);
       //单个文件最大限制
       su.setMaxFileSize(file_size);
       su.setCharset("utf-8");
       //开始文件上传
       su.upload();//服务器的内存中

       //得到第一个上传的文件
       //System.out.println(su.getFiles().getSize());
       file = su.getFiles().getFile(0);
       String path = null;
       if(!file.isMissing()){//如果上传了文件
           path = "upload\\";//文件保存的路径
           path+=file.getFileName();//加上了文件名
           file.saveAs(path, SmartUpload.SAVE_VIRTUAL);
       }
       System.out.println(path);

   }catch(Exception e){
       e.printStackTrace();
   }

%>
⑥ 表单其他输入项怎么获取?

姓名：<input type = "text" name = "sname"/>
获取sname
String sname = request.getParameter("sname");
out.print(sname);
----sname没有加载进去
【解决方式】
Request req = su.getRequest();
String sname = req.getParameter("sname");
out.print(uname);

二.富文本编辑器
① 概述
富文本编辑器，Rich Text Editor, 简称 RTE, 是一种可内嵌于浏览器，所见即所得的文本编辑器，类似于 Microsoft Word 的编辑功能。

② 常用的富文本编辑器
(1) ckeditor
(2) Kindeditor
(3) ueditor
(4) wangEditor
(5) SmartMarkUP
(6) Control.Editor
(7) EditArea
(8) Free Rich Text Editor

③ CKeditor的使用步骤
(1)【步骤一】官网https://ckeditor.com/ 下载-解压-引入
(2)【步骤二】

JavaWeb-10 (项目案例7 文件上传与富文本编辑器)相关推荐

结合element-ui实现文件上传以及富文本编辑器的使用
一.配置文件上传两个注意事项 1.action属性必须是绝对路径 2.手动配置请求头headers 完整代码: <el-uploadaction="http://www.ysqorz. ...
kindeditor java上传_富文本编辑器kindeditor上传图片的配置方法
[导读]这篇文章主要介绍了使用富文本编辑器上传图片实例详解的相关资料,需要的朋友可以参考下富文本编辑器上传图片一.导入kindeditor的js 二.将kindeditor与一个文本域textar ...
在线 - 支持word上传的富文本编辑器
这种方法是servlet,编写好在web.xml里配置servlet-class和servlet-mapping即可使用后台(服务端)java服务代码:(上传至ROOT/lqxcPics文件夹下) ...
django（7）modelform操作及验证、ajax操作普通表单数据提交、文件上传、富文本框基本使用...
一.modelForm操作及验证 1.获取数据库数据,界面展示数据并且获取前端提交的数据,并动态显示select框中的数据 views.py from django.shortcuts importr ...
PS修改过图片上传服务器,富文本编辑器图片上传base64存数据库改为服务器图片路径...
目录一.安装依赖 npm install quill-image-super-solution-module --save PS:如果不想npm引入可以直接把quill-image-super-so ...
wangEditor - 支持word上传的富文本编辑器
由于工作需要必须将word文档内容粘贴到编辑器中使用但发现word中的图片粘贴后变成了file:///xxxx.jpg这种内容,如果上传到服务器后其他人也访问不了,网上找了很多编辑器发现没有一个能直 ...
百度ueditor - 支持word上传的富文本编辑器
1.4.2之后官方并没有做功能的改动,1.4.2在word复制这块没有bug,其他版本会出现手动无法转存的情况本文使用的后台是Java.前端为Jsp(前端都一样,后台如果语言不通得自己做 Base6 ...
JavaWeb学习总结(五十)——文件上传和下载
在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载功能的实现. 对于文件上传,浏览器在上传的过程中是将文件以流的形式提交到服务器端的,如果直接使用 ...
TCP文件上传Java_Java 理解TCP通信案例：文件上传案例
文件上传分析图解 [客户端]输入流,从硬盘读取文件数据到程序中. [客户端]输出流,写出文件数据到服务端. [服务端]输入流,读取文件数据到服务端程序. [服务端]输出流,写出文件数据到服务器硬盘中. ...

JavaWeb-10 (项目案例7 文件上传与富文本编辑器)

JavaWeb-10 (项目案例7 文件上传与富文本编辑器)相关推荐

最新文章

热门文章