效果图:
获取写入相册权限
authorize-setting-popup组件
<template>
<view class="uni-popup-bottom">
<uni-popup ref="authorize" type="bottom">
<view class="authorize" v-if="source">
<view class="desc">检测到您没打开{{ authorizes[source].title }}权限,是否去设置打开?</view>
<view class="btns">
<button size="mini" @click="close">拒绝</button>
<button size="mini" type="primary" @click="confirm">允许</button>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
const MAP = {
photos: {
title: '保存到相册',
scope: 'scope.writePhotosAlbum',
setting: 'uni.saveVideoToPhotosAlbum'
}
};
export default {
props: ['source'],
data() {
return {
authorizes: MAP
};
},
options: {
styleIsolation: 'shared'
},
methods: {
confirm() {
uni.openSetting();
this.close();
},
close() {
this.$refs.authorize.close();
},
//获取用户授权
getAuth() {
const that = this;
uni.showLoading({
title: '获取权限中...'
});
uni.authorize({
scope: that.authorizes[that.source].scope,
success: res => {
that.$emit('onOk');
},
fail: res => {
uni.hideLoading();
uni.getSetting({
success: res => {
const setting = that.authorizes[that.source].setting;
if (!res.authSetting[setting]) {
that.$refs.authorize.open();
} else {
that.$emit('onOk');
}
}
});
}
});
}
}
};
</script>
<style lang="scss" scoped>
.authorize {
width: 100% !important;
padding: 50rpx;
box-sizing: border-box;
background-color: #e8e8e8;
.desc {
margin: 60rpx 0;
font-size: 26rpx;
}
.btns {
display: flex;
justify-content: space-between;
button {
width: 30%;
color: #1aad19;
}
button[type='primary'] {
background-color: #1aad19;
color: #fff;
}
}
}
</style>
<button @click="wxSave">保存</button>
<authorize-setting-popup ref="setting" source="photos" @onOk="wxDownload"></authorize-setting-popup>
wxSave() {
this.$refs.setting.getAuth();
},
wxDownload() {
wx.downloadFile({
url: this.url,
success(res) {
if (res.statusCode === 200) {
// 保存视频到相册
wx.saveVideoToPhotosAlbum({
filePath: res.tempFilePath
});
// 保存图片到相册
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath
});
}
}
});
},
参考链接: uniapp.dcloud.net.cn/api/other/a…
uniapp.dcloud.net.cn/api/other/s…