上传本地文件 Servlet 实例

最新推荐文章于 2023-05-06 16:31:43 发布

p0_0q9527

最新推荐文章于 2023-05-06 16:31:43 发布

阅读量273

点赞数 9

文章标签： java servlet html tomcat 经验分享

本文链接：https://blog.youkuaiyun.com/p0_0q9527/article/details/117621220

版权

本文介绍了如何在前端使用LayUI实现用户头像上传，包括文件上传组件的配置和后端Servlet处理文件上传，以及如何通过数据库持久化存储和登录后动态展示头像。涉及的技术包括MultipartFile、ServletFileUpload和JDBC操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

上传头像永久保存文件并且用户可切换

一，前端部分

<body>
<div class="layui-col-md12" style="height: 100%">
    <div class="layui-card-header layui-bg-green layui-font-20 ">${UserSession.getUserName()}的信息管理</div>
    <div class="layui-card-body layui-bg-black" style="height:89%">
        <div style="width: 450px;height:200px;left: 0;top: 0;bottom: 0;right: 0;margin: 10% auto;">
            <form class="layui-form" action="${pageContext.servletContext.contextPath}/Avatar" enctype="multipart/form-data" method="post" >
                <div class="layui-form-item">
                    <label class="layui-form-label">上传头像</label>
                    <div class="layui-input-inline">
                        <input type="file" name="password" required lay-verify="required" autocomplete="off" >
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit  type="submit" name="submit">立即提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

输入框类型为 type="file" ，表单设置编码类型 enctype="multipart/form-data"

发送数据方式务必为 post 因为 get方式最多只能上传1024字节的数据

设置好表单action 和相关css 就可以去后端写代码了这里是css用了layui

二，servlet部分

public class FileServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        try {
            ModifyAvatar(req,resp); //post 调用 ModifyAvatar方法
        } catch (FileUploadException | SQLException | ClassNotFoundException e) {
            e.printStackTrace();
        }
    }
    public void ModifyAvatar(HttpServletRequest req, HttpServletResponse resp) throws FileUploadException, IOException, SQLException, ClassNotFoundException {
        DiskFileItemFactory factory=new DiskFileItemFactory();
//        创建FileItem对象的工厂  对象的工厂，可以设定缓冲区大小和存放临时文件目录。
        File file=new File("C:\\Users\\我\\IdeaProjects\\MAVEN\\LayUi\\src\\main\\webapp\\Fileimg");
        if (!file.exists()){
            file.mkdirs();
        }//创建临时缓存目录
        factory.setRepository(file);
        //设置缓存文件存储位置
        ServletFileUpload fileUpload=new ServletFileUpload(factory);
        //ServletFileUpload类是Apache文件上传组件处理文件上传的核心高级类
        // 作用处理表单数据，将前端的请求数据封装到 FileItem 对象中。
        fileUpload.setHeaderEncoding("uft-8");
        //设置编码 避免上传的数据乱码
        List<FileItem> fileItems = fileUpload.parseRequest(req);
        //请求 前端数据 将数据全部封装成 FileItem类型 并且将加载到 list 集合中
        for (FileItem item:fileItems){
            //遍历集合
            if (item.isFormField()){
                //判读 是否为 不是文件类型  如果不是文件类型返回true 是的话为false
                //就是 在前端的 input 标签中的 type属性作为判断标准；
                //因为我的前端没有其他的类型所以我这一部分并没有去写，但是为了 方便后来修改 还是在这个地方腾出了地方
            }
            else {
                String filename=item.getName();
                // 是 文件的话 就获取 文件的名字
                if (filename!=null&&!filename.equals("")){//如果 文件名为空的话 就不执行以下的全部代码
                    filename= UUID.randomUUID().toString()+"_"+filename;
                    //重新定义文件名 用UUID类 重新在名字前面添加一个数据字符串 保证数据的唯一。
                    String filepath="C:\\Users\\我\\IdeaProjects\\MAVEN\\LayUi\\src\\main\\webapp\\layui\\img\\";
                    //定义 本地文件存储地址
                    UserFileServiceImpl fileService=new UserFileServiceImpl();
                    //这是一个自定 Service 层的类 用来操作数据库 增删改查
                    String UserCode=((User)req.getSession().getAttribute(UtilFinal.UserSession)).getUserCode();
                    // 调用前端 获取 前端Session获取已经登录用户的账号
                    fileService.setUserAvatarSVC(UserCode,filepath+filename);
                    //调用 Service 层 专门存储头像信息的方法 将头像的本地文件地址存储到数据库中
                    //存储内容：C:\Users\我\IdeaProjects\MAVEN\LayUi\src\main\webapp\layui\img\图片名字.jpg
                    System.out.println(filepath+filename);

                    File f=new File(filepath+filename);
                    //本地已存在文件夹 操作filepath文件夹下的内容

                    f.createNewFile();
                    //创建文件 filename

                    InputStream in=item.getInputStream();
                    //将 上传的文件转换成 字节流


                    FileOutputStream out=new FileOutputStream(f);
                    // 操作本地文件图片准备进行写入

                    byte[] bytes=new byte[1024];
                    int len;
                    while ((len=in.read(bytes))>0)
                        out.write(bytes,0,len);
                    //↑写入操作  具体IO流
                    in.close();
                    out.close();
                    item.delete();
                    System.out.println("sucess");
                    resp.sendRedirect("login.jsp");
                    //上传成功后 重定向到登陆页面
                }
            }
        }

    }
}

上传文件成功之后就会在自建的本地图片目录中显示

附

操作Dao层的 UserFileServiceImpl 类将不同用户的头像信息保存在数据库中和操作数据库的 UserFileDaoImpl 类用JDBC 增删改查数据库信息

三，如何在登录后显示头像

在tomcat 中显示本地图有好几种方法

这里引用别人写的

https://blog.youkuaiyun.com/mibi8840/article/details/80295259

但是我采用的方法是将本地图片在每次登录的时候读取数据库，将之前保存图片文件又重新临时的写入到 tomcat中，这样就可以达到永久保存并展现头像信息且不用修改server.xml

来看代码

登录 servlet 代码

public class LoginServlet extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doPost(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String userCode = req.getParameter("userCode");
        String password = req.getParameter("password");
        System.out.println(userCode);
        System.out.println(password);
        UserServiceInpl userServiceInpl = new UserServiceInpl();
        User user = null;
        try {
            user = userServiceInpl.getUserSVC(userCode);
        } catch (SQLException | ClassNotFoundException throwables) {
            throwables.printStackTrace();
        }
        if (password != null && password.equals(user.getUserPassword())) {
            req.getSession().setAttribute(UtilFinal.UserSession, user);
            // 上面是 实现登录 并且判断登录是否成功的代码
            // 这里是登录成功的代码区域
            try {
                buffederpic(req,resp,userCode); //登录 成功执行 buffederpic()方法
            } catch (SQLException throwables) {
                throwables.printStackTrace();
            } catch (ClassNotFoundException e) {
                e.printStackTrace();
            }
            resp.sendRedirect("jsp/Center.jsp");
            System.out.println("sucess");
        } else {
            req.setAttribute("ifpswd", true);
            req.getRequestDispatcher("/login.jsp").forward(req, resp);
        }
    }


    public void buffederpic(HttpServletRequest req, HttpServletResponse resp,String userCode) throws SQLException, ClassNotFoundException, IOException {
        UserFileServiceImpl fileService=new UserFileServiceImpl();
        //创建  UserFileServiceImpl 预执行数据库操作
        Files files=fileService.getFilesSVC(userCode);
        // 操作数据库 获得用户的文件信息 并且封装在 pojo下的 自定Files类型 这里面保存 本地用户文件的路径 和 账号
        if (files!=null) {//如果 files为空的话说明用户 并没有设置过头像 就直接跳过以下代码
            String webpath = "/upload/";
            String filename = files.getUserAvatar().substring(files.getUserAvatar().lastIndexOf("\\") + 1);
            // 获取 用户头像文件名
             if (new File("C:\\Users\\我\\IdeaProjects\\MAVEN\\LayUi\\src\\main\\webapp\\layui\\img\\"+filename).exists()) {//判断文件是否存在  不存在直接跳过
                 String filepath = getServletContext().getRealPath(webpath + filename);
                 // 获取 tomcat文件路径  并且 将 文件名和上级目录拼接起来

                 File file = new File(filepath);
                 //创建文件夹
                 file.getParentFile().mkdirs();
                 //创建文件
                 file.createNewFile();
                 FileInputStream in = new FileInputStream("C:\\Users\\我\\IdeaProjects\\MAVEN\\LayUi\\src\\main\\webapp\\layui\\img\\" + filename);
                 FileOutputStream out = new FileOutputStream(file);
                 byte[] bytes = new byte[1024];
                 int len;
                 while ((len = in.read(bytes)) > 0) {
                     out.write(bytes, 0, len);
                     out.flush();
                 }//以上就是将 文件 重本地文件复制到 tomcat中 xxx_war>upload文件夹中
                 files.setUserAvatar(webpath + filename);
                 //重新设置 files的头像路径 内容为：/upload/图片名字.jpg
                 System.out.println(files.getUserAvatar());
                 req.getSession().setAttribute(UtilFinal.UserFilesSession, files);
                 //将files 保存成session

                 in.close();
                 out.close();
             }
        }
    }
}

在登陆完成后

在此war中就会生成文件夹并且写入图片而tomcat 关闭后再次启动就会重新部署文件我们所建的缓存就会消失

然而再次登录就会出现这样就可以实现动态读取该用户的文件了

四，显示头像

用EL表达式获取 session 文件 Files 并getUserAvatar()获取头像路径这个路径就是保存在 war 下的缓存

<ul class="layui-nav layui-layout-right">
    <li class="layui-nav-item">
        <a href=""><img src="/LayUi_war${UserFilesSession.getUserAvatar()}" class="layui-nav-img">${UserSession.getUserName()}</a>
        <dl class="layui-nav-child">
            <dd><a href="ModifyAvatar.jsp">个人信息</a></dd>
            <dd><a href="SecurityManagement.jsp">隐私修改</a></dd>
            <dd><a href="${pageContext.servletContext.contextPath}/do_logout">注销</a></dd>
        </dl>
    </li>
</ul>

这样头像就显示出来了

附

需要的maven

<dependency>
    <groupId>commons-io</groupId>
    <artifactId>commons-io</artifactId>
    <version>2.6</version>
</dependency>
<dependency>
    <groupId>commons-fileupload</groupId>
    <artifactId>commons-fileupload</artifactId>
    <version>1.3.3</version>
</dependency>

这是完成这个功能需要jar包

头像在第一次重新登录的时候可能需要多次刷新才会出现。