uniapp实现app端和微信小程序端图片保存到本地,其它平台未测过,原理类似。

微信小程序端主要是权限需要使用button的开放能力来反复调起,代码如下:

首先是条件编译两个平台的按钮组件:

        <!-- #ifndef MP-WEIXIN -->
<view class="purple_btn btn_box" @click="saveImgToLocal">
保存到相册
</view>
<!-- #endif --> <!-- #ifdef MP-WEIXIN -->
<view v-if="openSettingBtnHidden" class="purple_btn btn_box" @click="saveEwm">
保存到相册
</view> <button v-else class="purple_btn btn_box" hover-class="none" open-type="openSetting" @opensetting='handleSetting'>保存到相册</button>
<!-- #endif -->

js部分如下:

var _self;
export default{
data(){
return {
openSettingBtnHidden: true,//是否授权
ewmImg:""//这是要保存的图片
}
},
onLoad(opt) {
_self = this;
},
components:{
},
methods:{
//微信小程序保存到相册
handleSetting(e){
if (!e.detail.authSetting['scope.writePhotosAlbum']) {
_self.openSettingBtnHidden = false;
} else {
_self.openSettingBtnHidden = true;
}
},
saveEwm:function(e){
//获取相册授权
uni.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
uni.authorize({
scope: 'scope.writePhotosAlbum',
success() {
//这里是用户同意授权后的回调
_self.saveImgToLocal();
},
fail() {//这里是用户拒绝授权后的回调
_self.openSettingBtnHidden=false
}
})
} else {//用户已经授权过了
_self.saveImgToLocal();
}
}
})
},
saveImgToLocal:function(e){ uni.showModal({
title: '提示',
content: '确定保存到相册吗',
success: function (res) {
if (res.confirm) { uni.downloadFile({
url: _self.ewmImg,//图片地址
success: (res) =>{
if (res.statusCode === 200){
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: function() {
uni.showToast({
title: "保存成功",
icon: "none"
});
},
fail: function() {
uni.showToast({
title: "保存失败",
icon: "none"
});
}
});
}
}
}) } else if (res.cancel) { }
}
}); }
}
}

uniapp保存图片到本地(APP和微信小程序端)的更多相关文章

  1. uniapp自定义顶部搜索框兼容微信小程序

    zhuanzai:  uniapp自定义顶部搜索框兼容微信小程序 自定义组件 navbarvue (胶囊底部高度 - 状态栏的高度) + (胶囊顶部高度 - 状态栏内的高度) = 导航栏的高度 < ...

  2. 12.通过微信小程序端访问企查查(采集工商信息)

    需要注意的问题: 一.1.微信端访问企查查小程序需要登录.2.访问抓包获取的url是有时效性的过一段时间就不能用了. http://xcx.qichacha.com/wxa/v1/base/getEn ...

  3. 如何开发一款堪比APP的微信小程序(腾讯内部团队分享)

    一夜之间,微信小程序刷爆了行业网站和朋友圈,小程序真的能如张小龙所说让用户"即用即走"吗? 其功能能和动辄几十兆安装文件的APP相比吗? 开发小程序,是不是意味着移动应用开发的一次 ...

  4. 手持式停车收费管理系统全套案例,支持车牌识别,包含了android版app,微信小程序查询,响应式管理后台,云端大数据存储

    先展示几个app效果图片吧,使用起来非常方便,关联了机器的快捷键操作,操作速度提高了不少,摄像头车牌自动识别,车牌识别无网络情况下离线也可以使用   再来一张后台截图,停车场信息完整显示,今日数据实时 ...

  5. 手机APP和微信小程序能否取代域名?

    有人说现在App是主流,手机上装几个App就可以了,以后域名的重要性会越来越低,直至App完全取代域名的域名无用论.真的是这样吗? 关于这个话题已经有很多先人前辈探讨过,这次誉名网从另外一个角度给各位 ...

  6. App唤起微信小程序和回调

    在同一开放平台账号下的移动应用及小程序无需关联即可完成跳转,非同一开放平台账号下的小程序需与移动应用(APP)成功关联后才支持跳转. 可在“管理中心-移动应用-应用详情-关联小程序信息”,为通过审核的 ...

  7. 用Python快速实现一个垃圾分类APP|附带微信小程序

    最近北京开始实行垃圾分类,导致大家对垃圾的研究热度突然涨高,垃圾们也纷纷表示从来没有获得过这么高的关注度.其实,上海市去年已经开始实行,网上已经有不少成熟的教程了,像什么<垃圾分类从入门到精通& ...

  8. 自家APP打开微信小程序,可行吗?

    小程序的通用解决方案,今天为大家介绍一下FinClip.它的最大特点,就是能够让任何 App 运行小程序. 只需要在你的 App 里面,引入它的 SDK,就能加载运行外部小程序了.除了 SDK,它还提 ...

  9. uni-app开发经验分享二十: 微信小程序 授权登录 获取详细信息 获取手机号

    授权页面 因为微信小程序提供的 权限弹窗 只能通用户确认授权 所以可以 写一个授权页面,让用户点击 来获取用户相关信息 然后再配合后台就可以完成登录 <button class="bt ...

随机推荐

  1. 使用Ganglia监控系统监控集群(debian)

    ganglia是一个集群监控软件,底层使用RRDTool获得数据. Ganglia分为ganglia-monitor和gmetad两部分,前者运行在集群每个节点上(被监控机器)收集RRDTool产生的 ...

  2. Debian 64位内核升级步骤

    安装相关依赖包 apt-get install bzip2 libncurses5-dev kernel-package zlib1g-dev gcc make kernel-package wget ...

  3. 这 5 个开源的能挣钱的 SpringBoot 项目,真TMD香!

    不得不佩服 Spring Boot 的生态如此强大,今天我给大家推荐几款 Gitee 上优秀的后台开源版本的管理系统,小伙伴们再也不用从头到尾撸一个项目了,简直就是接私活,挣钱的利器啊. SmartA ...

  4. Vue-router插件使用

    单页面原理 Vue是单页面开发,即页面不刷新. 页面不刷新,而又要根据用户选择完成内容的更新该怎么做?Vue中采用锚点来完成. 如访问http://127.0.0.1#/index就是主页,而访问ht ...

  5. [原题复现][极客大挑战 2019]HardSQL(updatexml报错注入)

    简介  原题复现:  考察知识点:SQL注入(报错注入,绕过过滤)  线上平台:https://buuoj.cn(北京联合大学公开的CTF平台 特别感谢!) 榆林学院内可使用信安协会内部的CTF训练平 ...

  6. div可以滚动但不显示滚动条

    首先有3个div, 第1个,固定大小是200*200(单位为px,下同) 第2个,不固定大小,其大小要用第3个div把个撑开,但是这个div必需要有滚动条, 第3个,固定大小与第1个div保持一致20 ...

  7. 使用Mac清理工具CleanMyMac对Mac电脑进行维护

    CleanMyMac是Mac系统下的一款苹果电脑清理软件,同时也是一款优秀的电脑维护软件,它能通过用户手动运行CleanMyMac内置脚本文件,释放电脑内存,帮助电脑缓解卡顿现象,保证电脑的良好持续运 ...

  8. Shell编程规范:Don't use ls | grep

    目录 一.背景 二.ShellCheck的规范 三.修改写法 1.ls | grep file 2.ls | grep regexp 3.ls | grep -v multi 四.最后 五.参考 一. ...

  9. uniapp分包(详尽版)

    PS:本文是笔者对基于uniapp的一小程序项目进行分包后的复盘文档,不足之处请多多指教. 一:分包相关概念 本质上是改变项目的路由以及优化项目各个模块的启动时间的一种优化技术. 主包与分包的概念 1 ...

  10. 断点调试 breakpoints(修改request)

    目录 1.抓取信息 2.点击breakpoints勾选断点 3.复制抓取的信息 4.点击proxy再点断点设置 5.点击勾选然后add添加其下如图 6.点击确定 7.刷新百度,charles出现的页面 ...