servlet修改用户头像_JavaWeb之上传头像-CSDN博客

本文链接：https://blog.csdn.net/weixin_39963819/article/details/111489531

本文介绍了使用JavaWeb中的Servlet进行文件上传，特别是用户头像的上传。讲解了如何处理multipart/form-data类型的POST请求，使用Part接口读取上传的文件，并将其保存到服务器。同时，文章还提到了在Tomcat7和8环境下处理文件名的不同方法，以及前端使用XMLHttpRequest进行文件上传的示例。

摘要由CSDN通过智能技术生成

JSP 可以与 HTML form 标签一起使用，来允许用户上传文件到服务器。上传的文件可以是文本文件或图像文件或任何文档。

需要引入的 jar 文件：commons-fileupload-1.3.2、commons-io-2.5.jar

I/O基础知识

I(Input输入)/O(Output输出)：I/O流输入流/输出流

对文件的读操作：使用输入流

对文件的写操作：使用输出流

流的分类

输入流(InputStream)/输出流(OutputStream)

字节流/字符流：例如对图片进行操作(copy)使用字节流对普通文件的操作可以使用字符流

节点流/处理流：节点流会直接关联到数据源上而处理流是对节点流功能的增强(不会直接关联数据源)

节点流

//使用FileInputStream对数据源读取字节

FileInputStream fis = new FileInputStream("b1.jpg");

//使用FileOutputStream向目标文件写字节

FileOutputStream fos = new FileOutputStream("b1_demo.jpg");

处理流

fr = new FileReader("Test.java");//源文件

br = new BufferedReader(fr);//处理流对fr节点流功能的增强

FileWriter fw = new FileWriter("Test_New.java");//目标文件

BufferedWriter bw = new BufferedWriter(fw);//处理流对fw节点流功能的增强

在API中凡是以InputStream/OutputStream结尾的都是字节流

凡是以Reader/Writer结尾的都是字符流

InputStream、 OutputStream、 Reader、Writer这四个类，是这两大继-

承体系的父类

所有字节流的根父类为：InputStream、 OutputStream

所有字符流的根父类为： Reader、Writer

创建一个文件上传表单

需要注意：

表单 method 属性应该设置为 POST 方法，不能使用 GET 方法。

表单 enctype 属性应该设置为 multipart/form-data.

表单 action 属性应该设置为在后端服务器上处理文件上传的 Servlet 文件。

上传单个文件，您应该使用单个带有属性 type="file" 的标签。

为了允许多个文件上传，请包含多个 name 属性值不同的 input 标签。输入标签具有不同的名称属性的值。浏览器会为每个 input 标签关联一个浏览按钮。

Servlet

package com.foreknow.servlet;

import javax.servlet.ServletException;

import javax.servlet.annotation.MultipartConfig;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import javax.servlet.http.Part;

import java.io.File;

import java.io.IOException;

import java.util.UUID;

/**

* Created by foreknow on 2018/12/13.

MultipartConfig

使用注解MultipartConfig 将一个 Servlet 标识为支持文件上传。Servlet3.0 将

multipart/form-data 的 POST 请求封装成 Part，通过 Part 对文件进行上传。

Servlet3 没有提供直接获取文件名的方法,需要从请求头中解析出来

@WebServlet(name = "UploadServlet",urlPatterns = "/upload")

@MultipartConfig

public class UploadServlet extends HttpServlet {

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

Part part = request.getPart("file");

String name = part.getSubmittedFileName();

UUID uuid = UUID.randomUUID();

String path = request.getServletContext().getRealPath("")+"/pic/";

File file = new File(path);

if (!file.exists()){

file.mkdirs();

}

part.write(path+uuid+name);

response.getWriter().print(uuid+name);

request.getSession().setAttribute("pic",uuid+name);

}

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

}

注意可能遇到的问题

在tomcat8使用servlet3.0上传文件，原来按以下步骤就可以完成

1.Part part = request.getPart("XX");

2.part.getSubmittedFileName()//直接获取文件名

3.part.write(realPath)

在tomcat7 的环境下就没有part.getSubmittedFileName()这一方法，无法直接获取文件名

解决方案：

String cd = part.getHeader("Content-Disposition");

//截取不同类型的文件需要自行判断

String filename = cd.substring(cd.lastIndexOf("=")+2, cd.length()-1);

upload.jsp

User: foreknow

Date: 2018/12/13

Time: 9:08

To change this template use File | Settings | File Templates.

--%>

$Title$

window.onload = function () {

document.querySelector("#file").onchange = function () {

var req = new XMLHttpRequest();

var form = new FormData(document.getElementById("form1"));

// form.append("file",document.querySelector("#file").files[0]);

req.open("post", "${pageContext.request.contextPath}/upload", true);

req.send(form);

req.onload = function () {

document.getElementById("img").src = "${pageContext.request.contextPath}/pic/" + req.responseText;

}

img {

width: 200px;

height: 200px;

border-radius: 50%;

}

οnerrοr="this.src='${pageContext.request.contextPath}/b1.jpg'">

实际应用

jsp页面中：