uniapp开发H5微信公众号,使用微信的扫一扫等Api试错

记录使用uniapp开发H5微信公众号,有些业务需要用到一些API，比如扫码，h5和微信小程序，app在使用过程中有有些不同，h5使用需要单独引入微信的jsdk,才能使用否则会报错无法使用

引入微信jsdk

npm安装
npm install jweixin-module --save
- 下载使用方式
下载地址：https://unpkg.com/jweixin-module@1.6.0/lib/index.js
引入
import wx from 'weixin-js-sdk';
1
2
3
4
5
6

使用

wx.config({
	debug: false, // 开启调试模式,
	appId: res.appId, // 必填，企业号的唯一标识
	timestamp: res.timestamp, // 必填，生成签名的时间戳
	nonceStr: res.nonceStr, // 必填，生成签名的随机串
	signature: res.signature, // 必填，签名
	jsApiList: ['scanQRCode','scanCode', 'checkJsApi', 'chooseImage'], // 必填，需使用的JS接口列表
});
wx.ready(() => {
	wx.scanQRCode({
		needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
		scanType: ['qrCode', 'barCode'], // 可以指定扫二维码还是一维码，默认二者都有
		success: function (res) { 
		var result = res.resultStr; // 当 needResult 为 1 时，扫码返回的结果
		var resultArr = result.split(','); // 扫描结果以逗号分割数组(一维码)
		var codeContent = resultArr[resultArr.length - 1]; // 获取数组最后一个元素，也就是最终的内容 
		_this.form.imei = codeContent
		alert('扫码成功!')
		},
	});
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

注意事项：在使用的时候必须要先调用wx.config这个微信的API，否则无法使用，然后再jsApiList参数中写入你需要用到的api
然后还有一个需要注意的地方，在扫码完成后获取返回值进行赋值的时候，无法直接赋值，因为this指向原因，需要提前定义一下
var _this = this