炫意html5
最早CSS3和HTML5移动技术网站之一

小程序 保存图片

wx.downloadFile(Object object)

下载文件资源到本地。客户端直接发起一个 HTTPS GET 请求,返回文件的本地临时路径 (本地路径),单次下载允许的最大文件为 50MB。
注意:请在服务端响应的 header 中指定合理的 Content-Type 字段,以保证客户端正确处理文件类型。

参数

属性类型默认值必填说明
urlstring下载资源的 url
headerObjectHTTP 请求的 Header,Header 中不能设置 Referer
timeoutnumber超时时间,单位为毫秒
filePathstring指定文件下载后存储的路径 (本地路径)
successfunction接口调用成功的回调函数
failfunction接口调用失败的回调函数
completefunction接口调用结束的回调函数(调用成功、失败都会执行)

示例

下面代码演示了下载一张网络图片:
wx.downloadFile({
url: 'https://example.com/audio/123', //仅为示例,并非真实的资源
success (res) {
filePath: res.tempFilePath
}
})

注意:在发布小程序上线之前一定要登录小程序微信公众号后台找到->开发配置downloadFile的域名和你要下载的网络图片的域名一致,否则下载不了;如下所示:
01
找到downloadFile服务器域名
02

wx.saveImageToPhotosAlbum(Object object)

保存图片到系统相册。
Object object
属性类型默认值必填说明
filePathstring图片文件路径,可以是临时文件路径或永久文件路径 (本地路径) ,不支持网络路径

保存图片功能,由于不能保存网络图片,所以需要先调用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设置轮回调起重新授权访问相册了

炫意HTML5 » 小程序 保存图片

Java基础教程Android基础教程