zoukankan      html  css  js  c++  java
  • 使用bootstrap-fileinput实现文件上传

    JSP:

    <script type="text/javascript">
        $('#testFile').fileinput({//初始化上传文件框
            showUpload: true,//是否显示上传总按钮
            showRemove: true,//是否显示移除总按钮
            uploadAsync: true,//默认异步上传
            uploadLabel: "上传",//设置上传按钮的汉字
            uploadClass: "btn btn-primary",//设置上传按钮样式
            showCaption: false,//是否显示标题
            language: "zh",//配置语言
            uploadUrl: "${contextPath}/sys/sc/doUpload",
            maxFileSize: 1024 * 1024 * 1024 * 10,//单位为kb,如果为0表示不限制文件大小
            maxFileCount: 20, /*允许最大上传数,可以多个,当前设置单个*/
            // enctype: 'multipart/form-data',
            //allowedPreviewTypes : [ 'image' ],
            // allowedFileTypes: ['image', 'video', 'flash'],
            // allowedFileExtensions : ["jpg", "doc","docx"],//接收的文件后缀
            msgFilesTooMany: "选择上传的文件数量({n}) 超过允许的最大数值{m}!",
            dropZoneTitle: "请通过拖拽文件放到这里",
            dropZoneClickTitle: "或者点击此区域添加文件",
            //uploadExtraData: {"id": 1, "fileName":'123.mp3'},//这个是外带数据
            showBrowse: false,
            showPreview: true,
            browseOnZoneClick: true,
            dropZoneEnabled: true,//是否显示拖拽区域
            layoutTemplates: {
                // actionDelete:'', //去除上传预览的缩略图中的删除图标
                // actionUpload: '',//去除上传预览缩略图中的上传图片;
                actionZoom: '' //去除上传预览缩略图中的查看详情预览的缩略图标。
            },
            slugCallback: function (filename) {
                return filename.replace('(', '_').replace(']', '_');
            }
        });
        //上传文件成功,回调函数
        $('#testFile').on("fileuploaded", function (event, data, previewId, index) {
            var result = data.response; //后台返回的json
            doQueryScxx(1);
        });
    
    </script>
    

    HTML:

    <body>
    <input id="testFile" name="testFile" type="file" multiple>
    </body>
    

    Controller:

    @RequestMapping("/doUpload")
    public void updatePhoto(HttpServletRequest request, HttpServletResponse response, @RequestParam("testFile") MultipartFile myFile) {
        try {
            TransactionResult t = this.uploadService.doUpload(request, response, myFile);
            writeJSON(response, t);
        } catch (Exception e) {
            logger.error(ExceptionUtil.getExceptionMessage(e));
        }
    }
    

    Service:

    public TransactionResult doUpload(HttpServletRequest request, HttpServletResponse response, MultipartFile myFile) throws Exception {
        TransactionResult t = ObjectUtil.getTransactionResult();
        t.setResultMessage("上传失败!");
        String ip = ObjectUtil.getSession().getIpName();
        try {
            Properties properties = new Properties();
            InputStream instream = this.getClass().getResourceAsStream("../../../../../DataSource.properties");
            properties.load(instream);
            String dataPath = properties.getProperty("filePath");/*获取文件路径*/
    
            Calendar cal = Calendar.getInstance();
            int month = cal.get(Calendar.MONTH) + 1;
            int year = cal.get(Calendar.YEAR);
            StringBuffer savePaths = new StringBuffer();
            savePaths.append(year + "/");
            savePaths.append(month + "/");
            StringBuffer filePath = new StringBuffer();
            filePath.append(dataPath);
            filePath.append(savePaths.toString());
    
            //图片名称
            String name = ObjectUtil.getSequencesId();
            //文件后缀名
            String ext = FilenameUtils.getExtension(myFile.getOriginalFilename());
            //相对路径
            String path = name + "." + ext;
            //文件前缀名
            String fjmc = FilenameUtils.getBaseName(myFile.getOriginalFilename());
    
            File file = new File(filePath.toString());
            if (!file.exists()) {
                file.mkdirs();
            }
            myFile.transferTo(new File(filePath + path));
    
            TestInfoFjxx fjxx = new TestInfoFjxx();
            fjxx.setXh(ObjectUtil.getSequencesId());
            fjxx.setFjmc(fjmc);
            fjxx.setFjlj(savePaths + path);
            fjxx.setLrrDm(ObjectUtil.getSession().getUserXh());
            fjxx.setLrrq(DateConvertUtil.getAcceptDate());
            t = this.uploadDao.doUpload(fjxx, RzxxUtil.acceptRzls("【上传】--保存上传文件信息", myFile.getOriginalFilename(), ip));
            if (t.isResultBoolean()) {
                t.setResultMessage("上传成功!");
            }
        } catch (Exception e) {
            logger.error(ExceptionUtil.getExceptionMessage(e));
            t.setResultMessage("系统异常!");
        }
        return t;
    }
    

    可以结合oss将文件保存到云端返回云端存储地址

  • 相关阅读:
    基本背包问题
    linux 共享内存实现
    Linux内存管理原理
    从inet_pton()看大小端字节序
    linux线程的实现
    简述memcached中的一致哈希
    c语言实现面向对象OOC
    论记忆力
    关于编程内存泄漏
    一道常考fork题挖掘
  • 原文地址:https://www.cnblogs.com/pipiapi/p/13884488.html
Copyright © 2011-2022 走看看