• spring MVC上传附件


    spring mvc为我们封装了十分简单的上传附件的方法,以下通过一个例子学习。

    1.jsp

    <%@ page language="java" contentType="text/html; charset=UTF-8"
        pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
    <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
    <!DOCTYPE>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>附件管理</title>
    <!-- css文件 -->
    <link rel="stylesheet" href="./static/bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet"
        href="./static/bootstrap/css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="./static/css/OtherCss/upload.css">
    <!-- js文件 -->
    <script type="text/javascript" src="./static/js/jquery-1.11.0.js"></script>
    <script type="text/javascript"
        src="./static/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="./static/js/OtherJs/upload.js"></script>
    <!-- ajax form -->
    <script type="text/javascript" src="./static/js/jquery.form.js"></script>
    <script type="text/javascript" src="./static/js/ajaxfileupload.js"></script>
    <script type="text/javascript"
        src="./static/js/jquery-migrate-1.2.1.min.js"></script>
    <script type="text/javascript">
        var dialog = frameElement.dialog;
        $(function() {
            $("#submit1").click(function() {
                if ($("#categoryName").val() == "") {
                    alert("请填写类别名称");
                    return false;
                }
                var ajax_option = {
                    url : "categoryAttSave",
                    type : "post",
                    dataType : "html",
                    success : function(data) {
                        if (data == 1) {
                            alert("成功");
                        } else {
                            alert("失败")
                        }
                        dialogClose();
                    }
                }
                $("#thisForm").ajaxSubmit(ajax_option);
            });
        });
    
        //返回
        function dialogClose() {
            parent.g.loadData(parent.g.parms);
            dialog.close();//关闭dialog 
        }
    </script>
    </head>
    <body>
        <form id="thisForm" method="post" action="categoryAttSave"
            enctype="multipart/form-data">
            <input type="hidden" name="categoryId" value="${category.categoryId}" />
            <div class="container-fluid ">
                <div class="col-xs-12">
                    <div class="panel-body ">
                        <div class="row">
                            <div class="col-xs-8 col-xs-offset-1 tipinfo"
                                style="padding-bottom: 10px">
                                <div class="input-group">
                                    <h3>${category.categoryName}</h3>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-8 col-xs-offset-1 tipinfo"
                                style="padding-bottom: 10px">
                                <div class="info_center" id="userface_x">
                                    <div class="upload_face">
                                        <div class="upload_btn">
                                            <a type="button" class="upload_vl" id="upface_tt">选择您要上传的图片</a>
                                            <p id="img_rq">仅支持JPG、GIF、PNG、JPEG、BMP格式,文件小于4M</p>
                                        </div>
                                        <div class="upface_img">
                                            <c:choose>
                                                <c:when test="${not empty category.categoryPic}">
                                                    <img id="preview" src="./${category.categoryPic}" />
                                                </c:when>
                                                <c:otherwise><img id="preview" src="./static/img/nopic.png" /></c:otherwise>
    
                                            </c:choose>
                                        </div>
                                        <div class="changeimg" style="display: none">
                                            <input id="fileimg" type="file" name="upload" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-5  col-xs-offset-5">
                                <button type="button" class="btn btn-default " onClick="dialogClose();">关闭</button>
                                <button type="button" class="btn btn-primary " id="submit1">
                                    提交</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </body>
    </html>

    主要要注意的是form的地方必须加 enctype="multipart/form-data"这句话,还有就是<input id="fileimg" type="file" name="upload" />这句话。本实例用了一个js的上传插件。只是优化了上传的体验,不涉及到原理,所以此处不介绍相关内容。主要还是介绍如何实现上传。

    2.后台代码

    controller

        @ResponseBody
        @RequestMapping("categoryAttSave")
        public String categoryAttSave(HttpServletRequest req, MultipartFile upload,
                int categoryId) {
            Integer result = categoryService.categoryAttSave(req, upload,
                    categoryId, uploadFile);
            return result.toString();
        }

    Service

    /**
         * 附件上传并修改数据库
         * 
         * @param req
         * @param upload
         * @param categoryId
         * @param uploadFile
         * @return
         */
        public int categoryAttSave(HttpServletRequest req, MultipartFile upload,
                int categoryId, String uploadFile) {
            int result = 0;
            String originalFileName = upload.getOriginalFilename();
            String suffix = IOUtil.getFileSuffix(originalFileName);
            String fileName = RandomUtil.getTimeStampPlusRand() + "." + suffix;
            String realPath = req.getServletContext().getRealPath(uploadFile);
            try {
                upload.transferTo(new File(realPath + "/" + fileName));
                // 数据库操作
                TCategory category = baseDao.getT(
                        "TCategoryMapper.selectByPrimaryKey", categoryId);
                String oldCategoryPic = category.getCategoryPic();
                category.setCategoryPic(uploadFile + "/" + fileName);
                baseDao.updateT("TCategoryMapper.updateCategoryPic", category);
                // 删除原来的图片
                IOUtil.deleteFile(req, oldCategoryPic);
                result = 1;
            } catch (IllegalStateException e) {
                e.printStackTrace();
            } catch (IOException e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
            return result;
        }

    其实主要是注意到传递过来的MultipartFile 名称,要与jsp里面的file名对应。还有就是我们需要用到request来获取附件最终存储的位置,所以传递了一个HttpServletRequest。上传就是这句话upload.transferTo(new File(realPath + "/" + fileName));很简单吧,如果我们自己写的话,就要通过输入流写入到file里了。而spring mvc只要一句简单的代码就实现了。

    PS:上述代码还是有弊端的,当我们没有选定需要上传的图片而点击了上传的时候,它会报如下错误。

    org.springframework.web.multipart.MultipartException: The current request is not a multipart request

    大概意思就是,你这个请求并不是关于文件上传的请求。这是spring 替你检查了并直接报运行错误。

    我们可以通过修改controller代码,替代spring 的检查,就可以规避这个错误了。

        @ResponseBody
        @RequestMapping("categoryAttSave")
        public String categoryAttSave(HttpServletRequest req, int categoryId) {
            MultipartFile upload = null;
            if (req instanceof MultipartHttpServletRequest) {
                upload = ((MultipartHttpServletRequest) req).getFile("upload");
            }
            Integer result = categoryService.categoryAttSave(req, upload, categoryId,
                    uploadFile);
            return result.toString();
        }

    上述代码我们自己检查是不是关于文件上传的请求,就不会报错了。

  • 相关阅读:
    TP5 查询mysql数据库时的find_in_set用法
    使用paginate方法分页无法判断获取的数据是否为空
    苹果电脑Mac系统如何安装Adobe Flash Player
    JavaScript Timing 事件及两种时钟写法
    JavaScript 弹出框
    JavaScript 表单验证
    fastadmin CMS等系列插件安装不成功的问题
    fastadmin中js是如何调用的
    fastadmin安装定时插件报错 ZipArchive::extractTo(): Permission denied
    今天科普一下 苹果开发者账号中:个人、公司、企业账号的区别
  • 原文地址:https://www.cnblogs.com/roy-blog/p/7090527.html
Copyright © 2020-2023  润新知