wangEditor3一般将图片上传到服务器很便捷,网上也有很多方法,但官方文档中给出的上传到七牛云的方法没领悟到什么意思,尝试了几次,没有成功,我就采取了一种折中的方法,即利用图片上传服务器的方法上传到七牛云。
首先在网页中配置wangEditor图片上传
1 2 3 4 5 6 var E = window.wangEditor; var editor = new E('#div1' , '#div2' ); editor.customConfig.debug = true ; editor.customConfig.uploadImgServer = '/post/upload' ; editor.customConfig.uploadFileName = 'multiple' ; <- 与后台获取文件名相同 editor.create();
创建结果返回类,wangEditor要求返回json信息
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 public class Result implements Serializable { private Integer errno; private String[] data; public Integer getErrno () { return errno; } public void setErrno (Integer errno) { this .errno = errno; } public String[] getData() { return data; } public void setData (String[] data) { this .data = data; } } public class ResultUtil { public static Result success (String[] object) { Result result = new Result(); result.setErrno(0 ); result.setData(object); return result; } public static Result success () { return null ; } }
七牛云上传工具类
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 @Service public class Qiniu { Logger logger = LogManager.getLogger(LogManager.ROOT_LOGGER_NAME); @Value ("${qiniu.accessKey}" ) private String accessKey; @Value ("${qiniu.secretKey}" ) private String secretKey; @Value ("${qiniu.bucket}" ) private String bucket; @Value ("${qiniu.path}" ) private String path; public String uploadToken (FileInputStream file, String key) { Configuration cfg = new Configuration(Zone.zone1()); UploadManager uploadManager = new UploadManager(cfg); logger.info("path=" + path); try { Auth auth = Auth.create(accessKey, secretKey); String upToken = auth.uploadToken(bucket); try { Response response = uploadManager.put(file, key, upToken, null , null ); DefaultPutRet putRet = new Gson().fromJson(response.bodyString(), DefaultPutRet.class); logger.info("key:" + putRet.key); String encodedFileName = URLEncoder.encode(putRet.key, "utf-8" ); String finalUrl = String.format("%s/%s" , path, encodedFileName); logger.info("访问地址:" + finalUrl); return finalUrl; } catch (QiniuException ex) { Response r = ex.response; System.err.println(r.toString()); try { System.err.println(r.bodyString()); } catch (QiniuException ex2) { } } } catch (Exception e) { e.printStackTrace(); } return "" ; } }
在springmvc进行文件处理
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 @Controller @RequestMapping ("/post" )public class PostController { @Resource private Qiniu qiniu; @RequestMapping (value = "/upload" , method = RequestMethod.POST) public @ResponseBody Result uploadImageHtml (MultipartFile multiple, HttpSession session, HttpServletRequest request) throws IOException { if (multiple != null ) { FileInputStream inputStream = (FileInputStream) multiple.getInputStream(); String fileName = multiple.getOriginalFilename(); User user = (User) SecurityContextHolder.getContext().getAuthentication().getPrincipal(); String fileNameExtension = fileName.substring(fileName.lastIndexOf("." ), fileName.length()); String realName = String.valueOf(System.currentTimeMillis()) + user.getUsername() + fileNameExtension; String path = qiniu.uploadToken(inputStream, realName); String [] str = {path}; return ResultUtil.success(str); } return ResultUtil.success(); } }