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
: 默认超时时间和最大超时时间都是 60s
-
tip
: 网络请求的 referer 是不可以设置的,格式固定为 https://servicewechat.com/{appid}/{version}/page-frame.html,其中{appid}
为小程序的 appid,{version}
为小程序的版本号,版本号为 0 表示为开发版。
-
tip
: 6.5.3 以及之前版本的 iOS 微信客户端header
设置无效
更多
微信小程序开发教程,可以关注hi小程序。