使用jquery.form.js+servlet实现文件异步上传

最新推荐文章于 2022-11-06 08:04:47 发布

oshidi

最新推荐文章于 2022-11-06 08:04:47 发布

阅读量1.4k

点赞数 2

分类专栏： java 文章标签： servlet 异步

本文链接：https://blog.csdn.net/oshidi/article/details/52047025

版权

java 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

之前一直用ajaxfileupload上传文件,但是无法解决跨域问题，用form表单提交文件又无法异步上传

现在用jqueryform就可以完美解决上面的问题

页面代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-1.11.2.min.js"></script>
    <script src="jquery.form.js"></script>
    <script src="test.js"></script>
</head>
<body>
<form id="form_file" method="post"  enctype="multipart/form-data">
    <input type="file" id="file_img" name="file" capture="camera" class=""/>
</form>
</body>
</html>

test.js代码

$(function () {
    $("#file_img").bind("change", function(){
        uploadFile();
    });

});

//上传图片
function uploadFile() {
    alert(1)

    $("#form_file").attr("action", "/xinqiqiu/imgUploadSer");
    $("#form_file").ajaxSubmit(function(message) {
        console.log(message);
        var jsonresult=JSON.parse(message);
        var imgurl=jsonresult.RESULT_DATA.IMGSRC;
        alert(imgurl)
    });
}

后台servlet代码

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

        request.setCharacterEncoding("utf-8");
        response.setContentType("text/html;charset=utf-8");
        PrintWriter out = response.getWriter();
        DiskFileItemFactory factory = new DiskFileItemFactory();
        ServletFileUpload sfu = new ServletFileUpload(factory);

        sfu.setFileSizeMax(1024 * 1024);
        //每个表单域中数据会封装到一个对应的FileItem对象上
        try {
            List<FileItem> items = sfu.parseRequest(request);
            //区分表单域
            for (int i = 0; i < items.size(); i++) {
                FileItem item = items.get(i);
                //isFormField为true，表示这不是文件上传表单域
                if (!item.isFormField()) {
                    ImageDomain imageDomain = new ImageDomain(item);
                    ImageHandler ih = new ImageHandler();
                    String pimg = ih.disposeImage(imageDomain);
                }
            }
            }catch(Exception e){
                log.error("上传图片", e);
                out.print(ss.packageError("上传图片失败"));
            }finally{
                out.flush();
                out.close();
            }
        }

ImageDomain为图片模型类

ImageHandler为上传图片操作类

具体就不在展开。

oshidi

关注

2
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
使用jquery.form.js+servlet实现文件异步上传

之前一直用ajaxfileupload上传文件,但是无法解决跨域问题，用form表单提交文件又无法异步上传现在用jqueryform就可以完美解决上面的问题页面代码 Title test.js代码$(function () { $("#file_img").bind("change", functi
复制链接

扫一扫