微信小程序怎么将本地资源上传到开发者服务器
本文小编为大家详细介绍"微信小程序怎么将本地资源上传到开发者服务器"，内容详细，步骤清晰，细节处理妥当，希望这篇"微信小程序怎么将本地资源上传到开发者服务器"文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。
wx.uploadFile(OBJECT)
将本地资源上传到开发者服务器。如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后，可通过此接口将本地资源上传到指定服务器。客户端发起一个HTTPS POST请求，其中Content-Type为multipart/form-data。
OBJECT参数说明：
| 参数 | 类型 | 必填 | 说明 |
|---|---|---|---|
| url | String | 是 | 开发者服务器url |
| filePath | String | 是 | 要上传文件资源的路径 |
| name | String | 是 | 文件对应的key , 开发者在服务器端通过这个key可以获取到文件二进制内容 |
| header | Object | 否 | HTTP 请求 Header，header中不能设置Referer |
| formData | Object | 否 | HTTP 请求中其他额外的form data |
| success | Function | 否 | 接口调用成功的回调函数 |
| fail | Function | 否 | 接口调用失败的回调函数 |
| complete | Function | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
success返回参数说明：
| 参数 | 类型 | 说明 |
|---|---|---|
| data | String | 开发者服务器返回的数据 |
| statusCode | Number | HTTP状态码 |
示例代码：
wx.chooseImage({ success:function(res){var tempFilePaths = res.tempFilePaths wx.uploadFile({ url: 'http://example.weixin.qq.com/upload', //仅为示例，非真实的接口地址 filePath: tempFilePaths[0], name:"file", formData:{"user":"test" } success: function(res){ var data = res.data //do something } }) }})返回值：
基础库 1.4.0 开始支持，低版本需做兼容处理
返回一个uploadTask对象，通过uploadTask，可监听上传进度变化事件，以及取消上传任务。
uploadTask
uploadTask 对象的方法列表：
| 方法 | 参数 | 说明 | 最低版本 |
|---|---|---|---|
| onProgressUpdate | callback | 监听上传进度变化 | 1.4.0 |
| abort | 中断上传任务 | 1.4.0 |
onProgressUpdate 返回参数说明：
| 参数 | 类型 | 说明 |
|---|---|---|
| progress | Number | 上传进度百分比 |
| totalBytesSent | Number | 已经上传的数据长度，单位 Bytes |
| totalBytesExpectedToSend | Number | 预期需要上传的数据总长度，单位 Bytes |
示例代码：
const uploadTask = wx.uploadFile({ url: 'http://example.weixin.qq.com/upload', //仅为示例，非真实的接口地址filePath: tempFilePaths[0], name: 'file', formData:{'user': 'test'}, success: function(res){var data = res.data//do something}})uploadTask.onProgressUpdate((res) => {console.log('上传进度', res.progress)console.log('已经上传的数据长度', res.totalBytesSent)console.log('预期需要上传的数据总长度', res.totalBytesExpectedToSend)})uploadTask.abort() // 取消上传任务Bug & Tip
tip: 最大并发限制是 10 个tip: 默认超时时间和最大超时时间都是 60s
wx.downloadFile(OBJECT)
下载文件资源到本地。客户端直接发起一个HTTP GET请求，返回文件的本地临时路径。
OBJECT参数说明：
| 参数 | 类型 | 必填 | 必填 |
|---|---|---|---|
| url | String | 是 | 下载资源的 url |
| header | Object | 否 | HTTP 请求 Header |
| success | Function | 否 | 下载成功后以 tempFilePath 的形式传给页面，res={tempFilePath:'文件的临时路径'} |
| fail | Function | 否 | 接口调用失败的回调函数 |
| complete | Function | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
注：文件的临时路径，在小程序本次启动期间可以正常使用，如需持久保存，需在主动调用 wx.saveFile，在小程序下次启动时才能访问得到。
示例代码:
wx.downloadFile({ url: 'http://example.com/audio/123', //仅为示例，并非真实的资源 success: function(res) { wx.playVoice({ filePath: res.tempFilePath }) }})返回值：
基础库 1.4.0 开始支持，低版本需做兼容处理
返回一个downloadTask对象，通过downloadTask，可监听下载进度变化事件，以及取消下载任务。
downloadTask
downloadTask 对象的方法列表：
| 方法 | 参数 | 说明 | 最低版本 |
|---|---|---|---|
| onProgressUpdate | callback | 监听下载进度变化 | 1.4.0 |
| abort | 中断下载任务 | 1.4.0 |
onProgressUpdate 返回参数说明：
| 参数 | 类型 | 说明 |
|---|---|---|
| progress | Number | 下载进度百分比 |
| totalBytesWritten | Number | 已经下载的数据长度，单位 Bytes |
| totalBytesExpectedToWrite | Number | 预期需要下载的数据总长度，单位 Bytes |
示例代码：
const downloadTask = wx.downloadFile({ url: 'http://example.com/audio/123', //仅为示例，并非真实的资源success: function(res) { wx.playVoice({ filePath: res.tempFilePath }) }})downloadTask.onProgressUpdate((res) => {console.log('下载进度', res.progress)console.log('已经下载的数据长度', res.totalBytesWritten)console.log('预期需要下载的数据总长度', res.totalBytesExpectedToWrite)})downloadTask.abort() // 取消下载任务Bug & Tip
tip: 最大并发限制是 10 个tip: 默认超时时间和最大超时时间都是 60stip: 网络请求的 referer 是不可以设置的，格式固定为 https://servicewechat.com/{appid}/{version}/page-frame.html，其中{appid}为小程序的 appid，{version}为小程序的版本号，版本号为 0 表示为开发版。tip: 6.5.3 以及之前版本的 iOS 微信客户端header设置无效
读到这里，这篇"微信小程序怎么将本地资源上传到开发者服务器"文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注行业资讯频道。
