微信小程序获取小程序二维码(小程序不发布不能使用)

  生成可带参数小程序二维码前后端都可以实现,但是最好还是由后端来生成传递给前端这边我是前端的主要介绍前端生成的方法,携带的参数scene 有长度限制 正常分享的需求可以实现,官方文档都有说明。

首先获取access_token 是开发小程序后端的必要参数,同样前端也是通过请求官方提供的接口来获取,取得token就很简单了,直接调用官方的接口,获取带参数的小程序二维码(注意返回的格式 由于是前端处理的会有格式问题 如果是后端的话 就可以直接存储数据库) 前端及转换格式 image 承接显示图片

    // 获取access_token
	methods:{
        geTaccessToken(){
				let that = this;
				wx.request({
				    url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=wxcf04e9673449714b&secret=6a31bacc0e0bc8d30d93d2af7caf7167',   //'grant_type=client_credential'是写死的,appid和secret在小程序控制台获取
				    method: 'get',
				    success: function (res) {
				        console.log(res,'access_token')
						that.getimg(res.data.access_token);
				    }
				})
			},
            // 获取二维码链接
			getimg(access_token){
				console.log(access_token)
				let that = this;
				let data = {
				      scene: that.id, //要传递的参数
				      page: 'pages/index/index', //扫码进入的小程序页面(特别特别特别注意,小程序未发布之前‘page’参数不能有,不然无法生成菊花码,不写此参数默认跳转首页,重要的事情说三遍!)
					  width:300
				}
				wx.request({
				      url: `https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=${access_token}`,
				      method: 'post',
				      data:data,
				      // dataType: 'json',
				      responseType: 'arraybuffer',         //将返回数据 按文本解析修改为arraybuffer
				      success: function (res) {
						const base64 = 'data:image/jpeg;base64,'+wx.arrayBufferToBase64(res.data)
				        console.log(base64,"res",res)
				        var arr =[];
				        arr.push(base64)
				        uploads({
				        	image:arr
				        }).then(res=>{
				        	console.log(res,'图片地址')
				        	that.url=`${that.imgUrl}${res.data.data[0]}`;
				        })
				    }
				})
			},
    	}
			

appid和secret要在小程序控制台查看(secret是AppSecret(小程序密钥)尽量不要重制,重制后可能无法登录和支付,可以先去和后端要,没有再重制)

注意坑!!!!

上述方法生成的微信小程序二维码到发布后是无法使用的,因为在代码中使用了https://api.weixin.qq.com,所以需要在微信小程序公众平台配置白名单,但是官方又不允许配置https://api.weixin.qq.com为白名单,所以还是无法使用,最后还是要后端生成。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值