问题描述:
一个h5链接内用qrcode生成了二维码,在IOS系统长按可识别,在华Android长按没有反应,截图保存下来长按是可以识别的
问题产生原因:
qrcode在页面生成二维码时,会生成一个canvas标签和一个img标签。在本地电脑浏览器上调试的时候,发现生成二维码之后canvas标签是会自动隐藏的,然后展示img标签,我们看到和识别的其实是图片。但是在Android手机上生成的canvas是不会隐藏的,我们看到的是canvas,所以无法识别,截图却可以。
解决方案:
手动将canvas隐藏,获取生成的链接拼到图片里面。
<!--用于存放canvas,隐藏-->
<div
id="QRCodeNone"
style="width:54%;height:200px;margin:8% 0 8% 23%;display:none;"
></div>
<!--用于存放二维码图片-->
<div
class="fir_code_m"
id="qrcode"
style="width:54%;height:200px;margin:8% 0 8% 23%;"
></div>
mounted() {
//二维码
var elem = document.getElementById("QRCodeNone");
var qrc = document.getElementById("qrcode");
var urlq =