之前以为扫码很复杂，后面找到了一个最简单的扫码功能，但是H5页面只能用微信打开，其他浏览器不支持。
- 原理：在本页跳转到第三方网站www.996315.com/api/scan/，扫完后再跳转回到本页面，跳转回来的页面会带有二维码的路径参数。
- 例如：如果本页面是localUrl，可以用a元素跳转（href为www.996315.com/api/scan/?r…过程很简单，2步就可以了。 **步骤一：**扫一扫 我项目中用的是vue，点击扫一扫时调用scanCode方法，其中redirect_uri参数是自己本页面地址（去掉路径参数的），以确保扫码回来后准确跳到本页面（不传redirect_uri有可能跳错页面）。
is_weixn() { return navigator.userAgent.toLowerCase().indexOf('micromessenger') !== -1 }, scanCode() { if (!this.is_weixn()) { alert('请用微信打开页面，扫码功能仅支持微信页面') return } sessionStorage.setItem('isInSerach', '1') let hrefStr = location.href let href = hrefStr if (hrefStr.indexOf('?') !== -1) { href = hrefStr.split('?')[0] } location.href = `https://www.996315.com/api/scan?redirect_uri=${encodeURIComponent(href)}` },
步骤二：获取扫到的二维码数据 我这里直接在mounted里调用initData方法，用获取vue-router的路径参数qrresult，其中code就是获取到的二维码。如果不用vue，也可以在页面刚加载完的时候，用原生的location获取本页面地址及和路径参数qrresult。
initData() { let isInSerach = sessionStorage.getItem('isInSerach') if (isInSerach) { let code = this.$route.query.qrresult if (code) { this.form.serialNumber = code this.searchInfo('ruleForm') } else { //没有扫码成功 alert('二维码内容格式不对，请扫描正确的二维码') } sessionStorage.removeItem('isInSerach') } }
