JavaWeb上传图片到项目目录并将相对路径保存到数据库踩坑

最新推荐文章于 2024-07-13 03:29:48 发布

白纸一样

最新推荐文章于 2024-07-13 03:29:48 发布

阅读量5.4k

点赞数 7

分类专栏： javaWeb的坑文章标签： servlet web java js

本文链接：https://blog.csdn.net/qq_45670042/article/details/107930144

版权

本文介绍了JavaWeb中上传图片到项目目录并保存图片路径到数据库的过程，涉及HTML表单、JS预览、Servlet处理。在上传过程中遇到的问题包括：浏览器安全机制导致的文件路径问题，以及使用`blob:`URL的处理。解决方案是使用multipart/form-data表单，确保文件路径的正确获取，并在服务器端处理文件保存。总结中强调了前端from表单的使用，文件夹创建，以及避免文件名冲突的方法。

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

首先放出来成功的方法

两个jar包：

commons-fileupload-1.4.jar
commons-io-2.4.jar

前端使用from表单提交图片

HTML

<form action="${pageContext.request.contextPath}/pictureServlet" method="post" enctype="multipart/form-data">
      <input id="input" type="file" name="file">
      <button id="btn" type="submit ">提交</button>
</form>
    <img id="img" src="">

JS实现预览

此时的预览所获得的路径不能传到后台操作，是blob:http…格式，下面会说

$("#a").change(function (e) {
        console.log(e)
        reader.readAsDataURL(this.files[0]);
          reader.onload = function(e){
            console.log(e.target.result);
            document.getElementById("im