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将文件保存到云端返回云端存储地址

  • 相关阅读:
    Atitit (Sketch Filter)素描滤镜的实现  图像处理  attilax总结v2
    JS设置cookie、读取cookie、删除cookie
    Atitit 图像处理30大经典算法attilax总结
    Atitit数据库层次架构表与知识点 attilax 总结
    Atitit 游戏的通常流程 attilax 总结 基于cocos2d api
    Atitti css transition Animation differ区别
    Atitit 图像清晰度 模糊度 检测 识别 评价算法 源码实现attilax总结
    Atitit 全屏模式的cs桌面客户端软件gui h5解决方案 Kiosk模式
    Atitit 混合叠加俩张图片的处理 图像处理解决方案 javafx blend
    Atitit  rgb yuv  hsv HSL 模式和 HSV(HSB) 图像色彩空间的区别
  • 原文地址:https://www.cnblogs.com/pipiapi/p/13884488.html
Copyright © 2011-2022 走看看