Servlet实现图片的上传和显示

发布于:2024-02-25 ⋅ 阅读:(50) ⋅ 点赞:(0)

本篇文章是在上一篇文章上改进而来

一、图片上传需要引用的jar包

链接:https://pan.baidu.com/s/17FLjlWlNEG5YnS_dl3C8WA
提取码:wbis
在这里插入图片描述

二、最后的结果

在这里插入图片描述

三、更改数据库增加图片路径字段path

在这里插入图片描述

四、前端页面增加图片上传按钮,和上传的复选框

在这里插入图片描述
在这里插入图片描述
代码
在这里插入图片描述
上传的复选框
在这里插入图片描述

  <div id = "upload" class = "white_content">
	    <form action="UploadServlet" method="post" enctype="multipart/form-data" >
	         id:<input type="text" id="up_id" name="up_id"> <br/>
	       	 文件上传:<input type="file" name="file"/> <br/>
	        <input type="submit" value="提交">
	    </form>
	</div>	

 <style> 
    .white_content { 
        display: none; 
        position: absolute; 
        top: 25%; 
        left: 25%; 
        width: 25%; 
        height: 25%; 
        padding: 20px; 
        border: 10px solid orange; 
        background-color: white; 
        z-index:1002; 
        overflow: auto; 
    } 
 </style> 

五、Servlet图片上传

(注意创建UploadServlet文件,并且在doPost()方法中编写代码)
在这里插入图片描述
创建的servlet类
在这里插入图片描述

protected void doPost(HttpServletRequest request,HttpServletResponse response)
            throws ServletException,IOException{
        //说明输入的请求信息采用UTF-8编码方式
        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html; charset=UTF-8");
        PrintWriter out = response.getWriter();
        //Servlet3.0中新引入的方法,用来处理multipart/form-data类型编码的表单
     
        //接收id
        String id = request.getParameter("up_id");
        System.out.println("id="+id); 
        
        //接收文件
        Part part = request.getPart("file");
        //获取HTTP头信息headerInfo=(form-data; name="file" filename="文件名")
        String headerInfo = part.getHeader("content-disposition");
        //从HTTP头信息中获取文件名fileName=(文件名)
        String fileName = headerInfo.substring(headerInfo.lastIndexOf("=") + 2, headerInfo.length() - 1);
        //获得存储上传文件的文件夹路径
        String fileSavingFolder = this.getServletContext().getRealPath("/upload");
        //获得存储上传文件的完整路径(文件夹路径+文件名)
        //文件夹位置固定,文件夹采用与上传文件的原始名字相同
        String fileSavingPath = fileSavingFolder + File.separator + fileName;
        System.out.println(fileSavingPath); 
        //如果存储上传文件的文件夹不存在,则创建文件夹
        File f = new File(fileSavingFolder + File.separator);
        if(!f.exists()){
            f.mkdirs();
        }
        
        System.out.println(fileName);
        //将文件的名称传递到服务器
        String sql = "update student set path = '"+fileName+"'  where id = "+id;
        MySqlUtil.update(sql);
        
        //将上传的文件内容写入服务器文件中
        part.write(fileSavingPath);
        //输出上传成功信息
        out.println("文件上传成功~!");    
    }

在这里插入图片描述
编写MySqlUtil.update()方法
上次课程已经创建了,看开头!

    public static int update(String sql) {
        int i =0;
        try {
			Class.forName("com.mysql.jdbc.Driver"); // 1.加载驱动
			//2.建立连接
			Connection connection = (Connection) DriverManager.getConnection("jdbc:mysql://localhost:3306/school", "root", "2020");
			Statement statement = (Statement) connection.createStatement();
			//4.执行sql语句
			statement.executeUpdate(sql);
			if(statement !=null) {
				statement.close();
			}
			if (connection !=null) {
				connection.close();
			}
			i++;
		} catch (Exception e) {
			// TODO Auto-generated catch block
			System.out.println("找不到驱动类,加载失败");
			e.printStackTrace();
		}    
        return i;
    }

@MultipartConfig注解
在这里插入图片描述

文件上传的Servlet上添加一个@MultipartConfig注解,否则服务器代码就无法使用getPart()方法,同时y也会影响普通字段的数据获取。

六、测试Servlet上传,并获取上传后的路径

在这里插入图片描述

七、配置路径,展示图片

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
增加图片展示区域
在这里插入图片描述

八、最终结果

在这里插入图片描述

本文含有隐藏内容,请 开通VIP 后查看

网站公告

今日签到

点亮在社区的每一天
去签到