微信小程式儲存圖片到相簿功能實現
阿新 • • 發佈:2018-11-30
專案中有個儲存二維碼到相簿的功能,所以涉及到使用者是否授權相簿許可權的問題。廢話不多說,直接上乾貨…
功能邏輯:
先檢查使用者請求過的許可權中是否允許"儲存到相簿"許可權,如果沒有請求過這個許可權,應該向使用者發起授權請求(彈窗授權),如果請求過這個許可權,並且授權了,那就儲存圖片,顯示儲存成功;如果請求過,但是是拒絕的,就跳到設定頁,重新授權。
上程式碼:
// wxml檔案
<view bindtap='save'>儲存圖片到相簿</view>
// js檔案
//點選儲存圖片
save () {
let that = this
//若二維碼未載入完畢,加個動畫提高使用者體驗
wx.showToast({
icon: 'loading',
title: '正在儲存圖片',
duration: 1000
})
//判斷使用者是否授權"儲存到相簿"
wx.getSetting({
success (res) {
//沒有許可權,發起授權
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success () {//使用者允許授權,儲存圖片到相簿
that.savePhoto();
},
fail () {//使用者點選拒絕授權,跳轉到設定頁,引導使用者授權
wx.openSetting({
success () {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success () {
that.savePhoto();
}
})
}
})
}
})
} else {//使用者已授權,儲存到相簿
that.savePhoto()
}
}
})
},
//儲存圖片到相簿,提示儲存成功
savePhoto() {
let that = this
wx.downloadFile({
url: that.data.imgUrl,
success: function (res) {
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success(res) {
wx.showToast({
title: '儲存成功',
icon: "success",
duration: 1000
})
}
})
}
})
}
- 注:如果你不點選"儲存到相簿"的時候去看設定頁,是沒有"儲存到相簿"的開關的,只有點過了儲存到相簿,請求過這個彈窗授權後,設定頁才會有"儲存到相簿"的開關
兄弟姐妹們,如果有幫助,別忘了給個好評喲