微信小程序上传图片方法2,使用formdata
主要是使用到formdata方式,但微信小程序并不支持,使用此插件
https://github.com/zlyboy/wx-formdata
两个js下载地址,下载
下面代码是先压缩再上传,同时也适用改造一次性多文件上传
1 | const FormData = require( '../../../lib/formData.js' ) |
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 | chooseImage() { wx.chooseMedia({ mediaType: [ 'image' ], sourceType: [ 'album' , 'camera' ], success(res) { const tempFiles = res.tempFiles; //单个图片 var imagePath = tempFiles[0].tempFilePath; wx.compressImage({ src: imagePath, quality: 80, //质量 compressedWidth:1024, //最大宽度 success: function (compRes){ let formData = new FormData(); formData.append( "maxWidth" , "1024" ); //服务端再裁剪 formData.append( "thumWidth" , "100" ); //缩略图 formData.append( "savedirectory" , "avatar" ); //保存在uploadfiles的文件夹名 formData.appendFile( "file" , compRes.tempFilePath); let data = formData.getData(); //下面是调用后端接口上传 api.upload(data.buffer,data.contentType).then( function (uploadRes) { //{success: true, msg: null, imageUrl: "/uploadfiles/sign/99_995de918a4104fd6b310d7cd90b2baff.jpg"} console.log( "上传结果" , uploadRes) }) } }) } }) } |
1 2 3 4 5 | //使用flyio插件调用招商口并上传 upload: (data, contentType) => fly.post( '/WebApi/upload/UploadImage' , data, { baseURL: getHostUrl(), headers: { 'Content-Type' : contentType } }) |
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· C# 集成 DeepSeek 模型实现 AI 私有化(本地部署与 API 调用教程)
· DeepSeek R1 简明指南:架构、训练、本地部署及硬件要求
· NetPad:一个.NET开源、跨平台的C#编辑器
· 面试官:你是如何进行SQL调优的?