小程序生成海报图片(或者原有的)并下载,&&相册授权&&按钮拉起二次授权
这是自己做小程序生成推广海报,并保存到本地相册的方法,向后台发起请求,返回一个海报图片,下载保存到相册,
如果只是单纯的下载图片代码43行-63行就足够了
如果想直接保存到相册,则不要做downFile的处理,直接调用saveImageToPhotoAlbum,线上版本无法保存临时路径的图片
具体看代码:
//选中轮播图中的一个作为海报背景图。可自行实验,只是自己的总结
bindchange: function(a) {
for (var t = this, o = a.detail.current, i = t.data.imgUrls, n = 0; n < i.length; n++) {
var e = i[o].plogo;
var title = i[o].title;
t.setData({
imgcxs: e,
title: title
});
}
t.setData({
tuhight: o,
//选中图片的id
nowid:a.detail.currentItemId,
});
},
//选中海报背景,拿到id后向后台发起请求,生成海报
bao: function() {
var that = this;
wx.showLoading({
title: "生成中",
mask: true,
});
//向后台发起请求,
wx.request({
url: api.url.poster,
method: "POST",
data:{
uid: app.globalData.userInfo.id,
postid:that.data.nowid,
},
header: {
'content-type': 'application/x-www-form-urlencoded'
},
success: function (res) {
console.log(res)
wx.hideLoading();
wx.showToast({
title: res.data.msg,
icon: "none"
})
//下载图片
//这里不能用wx.savefile()去保存,它不会自动保存在自己相册中的,只能用wx.saveImageToPhotosAlbum()调起相册
wx.downloadFile({
url: 后台返回图片的url(或者是网上的图片url),
success: function(a) {
//图片下载时的临时路径
var t = a.tempFilePath;
//通过wx.saveImageToPhotoAlbum调起本地相册,并保存
wx.saveImageToPhotosAlbum({
//需要保存的临时文件路径
filePath: a.tempFilePath ,
success: function (a) {
console.log(a);
wx.showToast({
title: "保存成功",
icon: "success",
duration: 2e3,
})
},
fail: function (err) {
console.log(err)
}
});
},
fail:err=>{
console.log(err)
}
})
}
真机的时候发现了一个问题,saveImageToPhotosAlbum没有调动本地相册。
后来发现是没有授权的原因,所以利用wx.getSetting进行检测,没有授权,调起弹窗授权,当授权成功,使ruler变为true,使授权按钮消失,
onShow:function(){
var that=this
wx.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success() {//这里是用户同意授权后的回调
that.setData({
ruler:true
})
},
fail() {//这里是用户拒绝授权后的回调
// wx.showModal({
// title: '警告',
// content: '授权失败,无法保存到相册',
// })
that.setData({
ruler:false
})
}
})
} else {//用户已经授权过了 }
}
})
},
如果用户拒绝了授权,短时间内则不会在出现弹窗,所以,如果需要用户授权使用此功能的话,需要按钮授权,当授权成功,使ruler变为true,使授权按钮消失,也就是一共两个按钮作做处理
wxml:
<button open-type="openSetting" bindopensetting='handleSetting' class="xsACA" wx:else>
<text bindtap="bao" style='background:#64bcfc'>授权相册</text>
</button>
handleSetting: function (e) {
let that = this;
// 对用户的设置进行判断,如果没有授权,即使用户返回到保存页面,显示的也是“去授权”按钮;同意授权之后才显示保存按钮
if (!e.detail.authSetting['scope.writePhotosAlbum']) {
wx.showModal({
title: '警告',
content: '若不打开授权,则无法将图片保存在相册中!',
showCancel: false
})
that.setData({
ruler: false
})
} else {
wx.showModal({
title: '提示',
content: '您已成功授权相册',
showCancel: false
})
that.setData({
ruler: true
})
}
},
小程序生成海报图片(或者原有的)并下载,&&相册授权&&按钮拉起二次授权的更多相关文章
- 小程序生成海报:通过 json 配置方式轻松制作一张海报图
背景 由于我们无法将小程序直接分享到朋友圈,但分享到朋友圈的需求又很多,业界目前的做法是利用小程序的 Canvas 功能生成一张带有二维码的图片,然后引导用户下载图片到本地后再分享到朋友圈.而小程序 ...
- 微信小程序生成分享图片,保存到本地
1.页面 <canvas canvas-id="shareCanvas" style="width:600px;height:900px">< ...
- 小程序生成海报 canvas
前言 微信小程序需要生成海报进行朋友圈分享,但是不同的手机会有问题, 然后首先是图片的问题 图片 在模拟器上没有报错,可是真机测试却什么也没画出来. canvas.drawImage 是不支持网络图片 ...
- 小程序生成海报demo
效果图: <view class='poste_box' id='canvas-container' style="margin:0 auto;border-radius:16rpx; ...
- 微信小程序生成海报保存图片到相册小测试
test.wxml <canvas style="width:{{imageWidth}}px;height:{{imageHeight}}px;" canvas-id=&q ...
- 微信小程序生成海报分享:canvas绘制文字溢出如何换行
主要思路: 1.先分割为字符串数组,然后一个字一个字绘图,利用ctx.measureText(string) 方法,获取绘制后的宽度,判断宽度在多少内就另起一行,再将各行拼成一个字符串 2.计算另起的 ...
- opensetting禁用后小程序二次授权的问题-以及根据定位城市获取天气
一. 关于wx.openSetting 接口废弃后的通过其他方式重新设置权限的问题 最近小程序更新了后,导致以下报错 "openSetting:fail 此接口已废弃,请使用 OpenSet ...
- 小程序(Wepy)--生成海报图片
对于小程序的分享, 除了分享给朋友, 好友群,是可以直接做到的, 但是要想扩大推广范围, 通过生成海报图片, 将自己小程序码带进去,应该是目前我所知的好办法了. 但是海报也不是那么好搞.之前自己手写出 ...
- [技术博客]海报图片生成——小程序canvas画布
目录 背景介绍 canvas简介 代码实现 难点讲解 圆角矩形裁剪失败之PS的妙用 编码不要过硬 对过长的文字进行截取 真机首次生成时字体不对 drawImage只能使用本地图片 背景介绍 目标:利用 ...
随机推荐
- core dump文件的生成
#include <stdio.h> int main(int argc, char *argv[]) { char * p = "abcdefg"; p[] = '; ...
- JavaScript验证输入的字符是否包含表情
以下是验证代码: function isEmojiCharacter(substring) { for ( var i = 0; i < substring.length; i++) { var ...
- sql中的 IF 条件语句的用法
IF 表达式 IF( expr1 , expr2 , expr3 ) expr1 的值为 TRUE,则返回值为 expr2 expr1 的值为FALSE,则返回值为 expr3 如下: SELECT ...
- Hive 口袋手册
2019-04-01 关键字:Hive 学习总结.Hive 基础 . Hive 进阶 .Hive 调优 . Hive 入门手册.Hive PDF 下载 本篇文章系本人就目前所掌握的知识对 Apache ...
- Android查看联系人简单记录
简单实现打印联系人信息,可以作为插入联系人的基础和主要代码块,作为个人记录的小逻辑 package com.lgqrlchinese.contactstest; import android.Mani ...
- 【XSY3126】异或II 数学
题目描述 给你一个序列 \(a_0,a_1,\ldots,a_{n-1}\).你要进行 \(t\) 次操作,每次操作是把序列 \(x\) 变为序列 \(y\),满足 \(y_i=\oplus_{j=0 ...
- Java【第七篇】面向对象之类设计
Java类的继承 类继承语法规则 < 修饰符> class < 子类名称> [extends < 父类>] { <属性和方法的声明> } 类的继承 子 ...
- hdu 2829 Lawrence(四边形不等式优化dp)
T. E. Lawrence was a controversial figure during World War I. He was a British officer who served in ...
- User-Agent 请求消息头
User-Agent User-Agent, 用户代理 请求消息头,其中包含了 客户机.客户端 的一些信息, 如 浏览器版本 和 类型, 操作系统的类型等. 具体解析 步骤, 推荐以下 博客文章 ...
- Gym - 101350F Monkeying Around(线段树+树状数组)
When the monkey professor leaves his class for a short time, all the monkeys go bananas. N monkeys a ...