Web前端最全厉害了网页扫码，所有方法都给你总结到这了，赶紧收藏(1)，前端 400道面试题通关宝典助你进大厂

总结

阿里十分注重你对源码的理解，对你所学，所用东西的理解，对项目的理解。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

方案二、vue-qr 插件

---

官方文档：

https://www.npmjs.com/package/vue-qr

该插件不仅支持 vue2 ，还支持 vue3 。功能强大，能够生成二维码，还能够扫描、识别二维码，解析二维码。

git 地址：

https://github.com/MuGuiLin/QRCode

• 有一个 HTML 版本。

• 有一个 vue.js 版本。

测试地址：Demo：

https://muguilin.github.io/QRCode

存在问题：

1、网页必须使用浏览打开，不可以使用微信内置浏览器。如果是微信打开，会提示 “对不起，未识别到扫描设备”。

2、非手机内置浏览器，如：QQ、UC、百度等浏览器APP内，会存在找不到扫瞄设备。

3、最重要的是用户体验差。用户需要在浏览器打开，授权之后，才能进行扫码。

方案三、微信扫一扫

---

我把测试地址发到公司群，让同事帮我测试的时候，我发现程序员测试都说没问题，非程序员基本都是直接使用微信，点击扫一扫的时候，统一都是：“ 对不起，未识别到扫描设备 ”。转念一想，扫一扫好像是给开发同事做的。

转换思路，让用户在微信内直接点进去之后就可以进行扫码！所以选择 微信网页开发 -> 调用微信扫一扫。

优点：

1、用户使用方便，直接可以使用微信扫码。

2、开发方便，不用再考虑兼容安卓和ios的各种浏览器。

实现步骤：

• 1、引入

引入方式1：

index.html 入口文件处引入 js 插件

在 wx 使用页面处，可以直接通过 window.wx 引用。

引入方式2：

npm install weixin-js-sdk

在需要使用的页面处，引入 wx 模块：import wx from ‘weixin-js-sdk’

• 2、配置

wx.config({

debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。

appId: ‘’, // 必填，公众号的唯一标识

timestamp: , // 必填，生成签名的时间戳

nonceStr: ‘’, // 必填，生成签名的随机串

signature: ‘’,// 必填，签名

jsApiList: [] // 必填，需要使用的JS接口列表

});

• 3、调用方法

最后

好了，这就是整理的前端从入门到放弃的学习笔记，还有很多没有整理到，我也算是边学边去整理，后续还会慢慢完善，这些相信够你学一阵子了。

做程序员，做前端工程师，真的是一个学习就会有回报的职业，不看出身高低，不看学历强弱，只要你的技术达到应有的水准，就能够得到对应的回报。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

学习从来没有一蹴而就，都是持之以恒的，正所谓活到老学到老，真正懂得学习的人，才不会被这个时代的洪流所淘汰。