二维码无法识别的原因

Posted 2023-04-17

你的二维码扫描不出来可能是有以下问题造成：
（1）二维码包含的信息太长，导致二维码识别度太低扫不出来，建议文本二维码的文字数量不超过150字（低端手机也能扫描）
（2）网址二维码的链接失效了，或者无法用手机查看
（3）二维码打印的介质扭曲或反光导致扫码软件无法识别
解决办法：
（1）内容过多的时候推荐使用草料活码
（2）确保输入的链接可以在手机端使用，如果没有能力新建一个手机页面，可以使用草料活码管理系统快速制作一个可在手机端查看的页面
（3）避免选择反光介质来印刷二维码 参考技术A 一个好办法，就是在图片上点击右键，用搜狗下载图片，之后图片就会变大，识别就会很高，我就是那样弄的，无法识别是因为原来的太小，

关于微信网页/H5游戏开发中二维码无法识别的解决方法

　　我接触微信H5开发已经有一年多了，做过很多案例也遇到很多的问题。今天我把困扰我半年之久的问题分享出来，也就是关于微信网页/H5游戏开发中二维码无法识别的解决方法。
　　我在百度搜索了许久，关于微信H5网页/游戏开发问题以及解决方案的相关文章少之又少，在相关前端交流群中问别人，一问三不知，平时这些群就会上班吹牛逼，真正交流问题的人少又少，真是揪心啊，最后还是得靠自己解决了。

【这里，我先举个栗子】

上面这个页面，相信从事微信H5开发的人应该很熟悉，就是常见的分享到朋友圈的页面，通常以【引导分享图标】+【广告文案】+【公众号二维码】组成。
但是微信H5开发者通常会遇到一个问题，就是手机长按扫描不了二维码，或者Android手机可以而iphone手机不可以，这里比较头疼。经过我反复研究与不断的测试，终于在一次通宵赶项目凌晨三四点把问题解决了，太特么有成就感了！

【来，不废话了直接上图】

这是我的解决方案，由一个img和background-image组成，img的右下脚用absolute定位在background-image的中心，然后img设置opacity:0或者设置visibility:hidden，问题就解决了。别问我为什么，我也不知道，反正能解决，哈哈。或许其他小伙伴有更好的解决方案，欢迎提供。

CSS部分

.qrcodeWrap {
    position: relative; width: 150px; height: 150px
    margin: 0 auto; 
    background: url(qrcode.jpg) no-repeat center center;
    background-size: contain;
}
.qrcodeWrap img {
    position: absolute; left: -75px; top: -75px;
    width: 150px; height: 150px; 
    display: block;
    border: none;
    opacity:0;    /*visibility:hidden*/
}

HTML部分

<div class="qrcodeWrap">
    <img style="" src="qrcode.jpg" alt="扫描二维码"/>
<div>

 就是这么简单啦。