文件上传到页面展示

文件上传到页面进行展示
效果图如下：
在这里插入图片描述
用文字真的不是很好形容，下面直接用代码进行展示把
servlet中的代码：

package com.itheima;

import org.apache.commons.fileupload.FileItem;
import org.apache.commons.fileupload.disk.DiskFileItemFactory;
import org.apache.commons.fileupload.servlet.ServletFileUpload;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.File;
import java.io.IOException;
import java.util.List;

@WebServlet("/fileServlet")
public class fileServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        try {
            testUpload(request,response);
        } catch (Exception e) {
            e.printStackTrace();
        }
        request.getRequestDispatcher("/fileDownLoad.jsp").forward(request,response);
    }

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

    private void testUpload(HttpServletRequest request, HttpServletResponse response) throws Exception {
        //1.确认该操作是否支持文件上传操作，enctype=“multipart/form-date
        if (ServletFileUpload.isMultipartContent(request)) {
            //2.创建磁盘工厂对象
            DiskFileItemFactory factory = new DiskFileItemFactory();
            //3.Servlet文件上传核心对象
            ServletFileUpload fileUpload = new ServletFileUpload(factory);
            //4.从request中读取数据
            List<FileItem> fileItems = fileUpload.parseRequest(request);
            for (FileItem item : fileItems) {
                //5.当前表单是否是文件表单
                if (!item.isFormField()) {
                    //6.从临时存储文件的地方将内容写入到指定位置
                    item.write(new File(this.getServletContext().getRealPath("upload"), item.getName()));
       //这一行代码主要是在这个页面中进行展示，一般情况下是将图片保存到指定的位置，需要的时候再进行展示
                    request.setAttribute("picture",item.getName());
                }
                //这行代码也是不需要的，打印出来帮助理解jsp页面中的代码
                System.out.println(item);
            }
        }
    }
}

jsp中的代码：

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
        <div>
            <form id="editForm" action="${pageContext.request.contextPath}/fileServlet" method="post" enctype="multipart/form-data">
                <div>题干图片</div>
                <div>
                    <input type="file" placeholder="题干图片" name="picture">
                </div>
                <div>
                    <button type="button" onclick='document.getElementById("editForm").submit()'>保存</button>
                    <button type="button" onclick="history.back(-1);">返回</button>
                </div>
            </form>
        </div>
        
        <c:if test="${picture.length() > 0}">
            <div class="col-md-2 title">题干图片</div>
            <div class="col-md-10 data ">
                <img src="upload/${picture}"/>
            </div>
        </c:if>
</body>
</html>

原文链接：https://blog.csdn.net/awei19950103/article/details/108955109