npm install weixin-js-sdk --save
<template><div class="con"><header class="tit">请扫描需要识别的设备二维码</header><img id="scan" @click="onscan" :src="scan" style="margin: 2rem auto;display: block;" alt=""></div></template><script>// import qs from 'qs'import wx from 'weixin-js-sdk'// 监听安卓返回键退出公众号window.history.pushState(null, null, "#");window.addEventListener('popstate', function(e) {WeixinJSBridge.call('closeWindow');}, false);export default {name: 'login',data() {return {scan: require('../assets/scan.png'),}},mounted() {this.getSign()},methods: {getSign() {let url = location.href.split('#')[0]this.$post('wxMess/getSign', {url: url,}).then((r) => {console.log(r);let data=r.data// alert(data.timestamp)wx.config({debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。appId: 'wxe5b999b346138cc6',timestamp: data.timestamp,nonceStr: data.nonceStr,signature: data.signature,jsApiList: ['checkJsApi', 'scanQRCode']});wx.ready(() => {console.log('配置成功')})wx.error(function (res) {console.log(res)});})},onscan() {var that = thiswx.ready(function () {wx.checkJsApi({jsApiList: ['scanQRCode'], // 需要检测的JS接口列表，所有JS接口列表见附录2,success: function (res) {var result = res.resultStr;console.log(result)// 以键值对的形式返回，可用的api值true，不可用为false// 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}}});wx.scanQRCode({needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有success: function (res) {var result = res.resultStr;console.log('结果:' + res.resultStr);that.$router.push({path: '/detail',query: {resultStr: result}})}});})wx.error(function (res) {console.log(res)// console.log('失败')// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。});}}}</script><!-- Add "scoped" attribute to limit CSS to this component only --><style scoped>* {margin: 0;padding: 0;}.con {width: 100%;height: 100%;}#scan {/*background: url(js/scan.png) no-repeat;*//*background-size: 100% 100%;*/margin: 4rem auto;width: 2rem;height: 2rem;}.tit {width: 100%;height: 0.8rem;background: #02A7F0;color: #fff;text-indent: 0.2rem;font-size: 0.32rem;line-height: .8rem;}</style>
