小程序 保存图片
wx.downloadFile(Object object)
下载文件资源到本地。客户端直接发起一个 HTTPS GET 请求,返回文件的本地临时路径 (本地路径),单次下载允许的最大文件为 50MB。
注意:请在服务端响应的 header 中指定合理的 Content-Type 字段,以保证客户端正确处理文件类型。
参数
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| url | string | 是 | 下载资源的 url | |
| header | Object | 否 | HTTP 请求的 Header,Header 中不能设置 Referer | |
| timeout | number | 否 | 超时时间,单位为毫秒 | |
| filePath | string | 否 | 指定文件下载后存储的路径 (本地路径) | |
| success | function | 否 | 接口调用成功的回调函数 | |
| fail | function | 否 | 接口调用失败的回调函数 | |
| complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
示例
下面代码演示了下载一张网络图片:
wx.downloadFile({
url: 'https://example.com/audio/123', //仅为示例,并非真实的资源
success (res) {
filePath: res.tempFilePath
}
})
注意:在发布小程序上线之前一定要登录小程序微信公众号后台找到->开发配置downloadFile的域名和你要下载的网络图片的域名一致,否则下载不了;如下所示:

找到downloadFile服务器域名

wx.saveImageToPhotosAlbum(Object object)
保存图片到系统相册。
Object object
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| filePath | string | 是 | 图片文件路径,可以是临时文件路径或永久文件路径 (本地路径) ,不支持网络路径 |
保存图片功能,由于不能保存网络图片,所以需要先调用wx.downloadFile方法下载到本地临时空间路径:
wx.downloadFile({
url: 'https://example.com/audio/123', //仅为示例,并非真实的资源
success (res) {
let imageFilePath = res.tempFilePath
wx.saveImageToPhotosAlbum({
filePath: imageFilePath,
success(res){
wx.showToast({
title: "保存成功",
})
},
fail(){
wx.showToast({
title: "保存失败",
})
}
})
}
})
为了避免用户一开始就拒绝相册授权,导致不能再次保存图片,需要重新调起授权:
//绑定事件
<view bindtap="saveImage">保存图片</view>
saveImage(){
wx.downloadFile({
url: 'https://example.com/audio/123', //仅为示例,并非真实的资源
success (res) {
let imageFilePath = res.tempFilePath
wx.saveImageToPhotosAlbum({
filePath: imageFilePath,
success(res){
wx.showToast({
title: "保存成功",
})
},
fail(err){
if (err.errMsg === "saveImageToPhotosAlbum:fail:auth denied" || err.errMsg === "saveImageToPhotosAlbum:fail auth deny" || err.errMsg === "saveImageToPhotosAlbum:fail authorize no response") {
// 这边微信做过调整,必须要在按钮中触发,因此需要在弹框回调中进行调用
wx.showModal({
title: '提示',
content: '需要您授权保存相册',
showCancel: false,
success: () => {
wx.openSetting({
success(settingdata) {
if (settingdata.authSetting['scope.writePhotosAlbum']) {
wx.showModal({
title: '提示',
content: '获取权限成功,再次点击保存图片',
showCancel: false,
})
} else {
wx.showModal({
title: '提示',
content: '获取权限失败,将无法保存到相册哦~',
showCancel: false,
})
}
}
})
}
})
}
}
})
}
})
}
如果用户一开始拒绝授权,上面代码再次点击就可以wx.openSetting设置轮回调起重新授权访问相册了