uni-app h5 扫一扫

在使用uni-app开发微信公众号(H5)时,基本上都需要用到微信的JSSDK。

首先,先下载js,地址: https://unpkg.com/jweixin-module@1.4.1/out/index.js

然后在项目根目录新建一个jweixin文件夹,把下载下来的js放到此文件夹下面。

接着就是使用了,在你需要使用的页面中引入:

const jweixin = require('../../jweixin')

使用微信 js-sdk 的时候,都需要通过config接口注入权限验证配置。所以需要先调用后台接口获取config配置:


			async getConfig() {
				let [error, res] = await uni.request({
					url: '/api/api/WXJSSDK/GetConfig',
					method: 'GET',
					data: {
						url: location.href
					}
				})
				let s = res.data
				jweixin.config({
					debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
					appId: s.appId, // 必填,公众号的唯一标识
					timestamp: s.timestamp, // 必填,生成签名的时间戳
					nonceStr: s.nonceStr, // 必填,生成签名的随机串
					signature: s.signature, // 必填,签名
					jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "scanQRCode"] // 必填,需要使用的JS接口列表
				});
			},

然后再onLoad中调用:

        async onLoad() {
			await this.getConfig()
		},

最后给扫一扫添加点击事件:

            scan() {
				const _this = this
				jweixin.scanQRCode({
					needResult: 1, // 默认为0,扫描结果由微信处理,1则直接返回扫描结果,
					scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码,默认二者都有
					success: function (res) {
						let str = res.resultStr; // 当needResult 为 1 时,扫码返回的结果
						console.log(str)
					}
				});
			}

 

    原文作者:陈 俊 刚
    原文地址: https://blog.csdn.net/csdn9_14/article/details/100085029
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞