做网站需要哪一些内容,做外贸用哪些网站,网店美工毕业设计,自己做的网站打开超慢1. 前言#xff1a; picgo插件的简单开发 上篇文章我们简单写了picgo上传插件#xff0c;但是当我们测试的时候#xff0c;发现问题了#xff0c;后端MultipartFile file接受到的文件为null。
2. 排查问题#xff1a; 参考的文档 picgo api列表关于multipart form-data中…1. 前言 picgo插件的简单开发 上篇文章我们简单写了picgo上传插件但是当我们测试的时候发现问题了后端MultipartFile file接受到的文件为null。
2. 排查问题 参考的文档 picgo api列表关于multipart form-data中filename的问题 2.1. 我们先排查前端
const handle async (ctx) {let userConfig ctx.getConfig(picBed.haowan-uploader)if (!userConfig) {throw new Error(Can\t find uploader config)}const Url userConfig.Urlconst Token userConfig.Tokenconst imgList ctx.outputfor (let i in imgList) {let image imgList[i].bufferif (!image imgList[i].base64Image) {image Buffer.from(imgList[i].base64Image, base64)}const postConfig postOptions(Url, Token, imgList[i].fileName, image)let body await ctx.request(postConfig)body JSON.parse(body)return ctx
}const postOptions (Url, Token, fileName, image) {return {method: POST,url: Url /api/picgo/upload,headers: {contentType: multipart/form-data,Authorization: Token,User-Agent: PicGo},formData: {file : image,fileName}}
} 我首先考虑的是我api使用问题 我使用的是pico的.request方法作者描述是通过使用axios实现的。 使用formdata属性配置表单数据是没有问题的可以看到picgo的底层通过读取formdata属性把你所配置的数据读取配置到axios发送的data数据中。是axios的常用实现。 由于我们使用的是picgo gui所以控制台无法方便的使用所以我们下面从后端排查数据是否发送
2.2. 排查后端 在参数接收这里点上debug 我们可以看出并非没有接受文件只是在最后并没有转换成文件。 查看body流读取的源码
CollectionPart parts request.getParts();this.multipartParameterNames new LinkedHashSet(parts.size());MultiValueMapString, MultipartFile files new LinkedMultiValueMap(parts.size());Iterator var4 parts.iterator();while(var4.hasNext()) {Part part (Part)var4.next();String headerValue part.getHeader(Content-Disposition);ContentDisposition disposition ContentDisposition.parse(headerValue);String filename disposition.getFilename();if (filename ! null) {if (filename.startsWith(?) filename.endsWith(?)) {filename StandardMultipartHttpServletRequest.MimeDelegate.decode(filename);}files.add(part.getName(), new StandardMultipartFile(part, filename));} else {this.multipartParameterNames.add(part.getName());}}this.setMultipartFiles(files);String filename disposition.getFilename();由于这里文件名为空以致于mvc根本不处理文件流。
那么解决方案就显而易见给添加上文件流就行。
3. 解决方案添加文件名 https://www.rfc-editor.org/rfc/rfc1867 formdata上传文件描述 2. formdata buffer流添加文件名 formData: {file: {value: image,options: {filename: fileName}}可以在formdata中可选属性options添加文件名的选项。就可以成功读取了。