bootstrap多图片上传实现

xiaoxiao2021-02-28  43

<div class="file-loading">                 <input id="file-1" type="file" multiple class="file" data-overwrite-initial="false" data-min-file-count="2">             </div>   [html]  view plain  copy <script>  $("#file-1").fileinput({      theme: 'fa',      uploadUrl: 'uploader/uploader.do', // you must set a valid URL here else you will get an error      allowedFileExtensions: ['jpg', 'png', 'gif'],      overwriteInitial: false,      maxFileSize: 1000,      maxFilesNum: 10,      enctype: 'multipart/form-data',      //allowedFileTypes: ['image', 'video', 'flash'],      slugCallback: function (filename) {          return filename.replace('(', '_').replace(']', '_');      }  });  

</script>  

需要引入fileinput.js

后端代码

@SuppressWarnings("resource") @RequestMapping(value = "/uploader.do") public Map<String, Object> upload(HttpServletRequest request, HttpServletResponse response) throws IOException{ response.setCharacterEncoding("UTF-8"); Map<String, Object> json = new HashMap<String, Object>();        MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;                /** 页面控件的文件流* */        MultipartFile multipartFile = null;        Map map =multipartRequest.getFileMap();         for (Iterator i = map.keySet().iterator(); i.hasNext();) {                Object obj = i.next();                multipartFile=(MultipartFile) map.get(obj);               }        /** 获取文件的后缀* */        String filename = multipartFile.getOriginalFilename();        InputStream inputStream;        String basePath=servletContext.getRealPath("/").substring(0, servletContext.getRealPath("/").lastIndexOf("bspheis-wechat"))+"/upload/";        String outPath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort();        String newVersionName = "";        String fileMd5 = "";        byte[] data = new byte[1024];        int len = 0;        FileOutputStream fileOutputStream = null;                try {            inputStream = multipartFile.getInputStream();            fileOutputStream = new FileOutputStream(basePath+filename);            while ((len = inputStream.read(data)) != -1) {            fileOutputStream.write(data, 0, len);            }                   } catch (Exception e) {            e.printStackTrace();        }             json.put("newVersionName", filename);        json.put("fileMd5", fileMd5);        json.put("message", "图片上传成功");        json.put("status", true);        return json; }

转载请注明原文地址: https://www.6miu.com/read-1450368.html

最新回复(0)