vant的Uploader 文件上传,图片数据回显问题_vue.js_

上传证件照

 const afterRead = (file) => { state.staffPhoto = file.content; }; 

 // 返回布尔值 const beforeRead = (file) => { if (file.type !== "image/jpeg") { Toast("请上传 jpg 格式图片"); return false; } return true; }; 

 const onOversize = () => { Toast("文件大小不能超过 500kb"); }; 

let photos = [] that.fileList.forEach(v=> { let o = { base64Str: v.content, filename: v.file.name } photos.push(o) })

axios.request({ url: '/x/xxx/api', data: { photos: photos }, method: 'POST' })

@RequestMapping(value = "/api", method = RequestMethod.POST) public JSONObject xxx(@RequestBody JSONObject jsonObject) { JSONArray photos = jsonObject.getJSONArray("photos"); if (photos.size() > 0) { for (int i = 0; i < photos.size(); i++) { JSONObject obj = photos.getJSONObject(i); String fileName = obj.getString("filename"); String base64Str = obj.getString("base64Str"); String directoryName = "xx/xx"; String extension = fileName.substring(fileName.lastIndexOf(".")).toLowerCase(); InputStream inputStream = new ByteArrayInputStream(Base64.decodeBase64(base64Str.substring(base64Str.indexOf(",") + 1))); OSSClient client = new OSSClient(endpoint, accessKeyId, accessKeySecret); client.putObject(bucketName, getRandomKey(directoryName, extension), inputStream); // extension指的是拓展名，例如".amr" } } } /** * 随机生成一个key * @return String 随机key */ public static String getRandomKey(String directoryName, String extension){ StringBuffer key = new StringBuffer(); if (StringUtils.isNotBlank(directoryName)) { key.append(directoryName); if (directoryName.charAt(directoryName.length() - 1) != '/') { key.append("/"); } } key.append(System.currentTimeMillis()); for (int i = 0; i < 10; i++) { key.append(randomStr.charAt(RandomUtils.nextInt(0, randomStr.length()))); } if (StringUtils.isNotBlank(extension)) { if (extension.indexOf(".") == -1) { key.append("."); } key.append(extension); } return key.toString(); }