IOS二维码识别有效区域偏移问题解决方案

 

 

 

IOS二维码识别有效区域偏移问题解决方案

一、出现问题：

 

在整合手机端页面的时候遇到一个神奇的现象，如图1-1所示，在微信打开的H5页面中，长按二维码识别的有效区域不是在二维码上，而是在灰色区域上，这问题只出现在苹果手机由微信打开的时候，而安卓手机则不会出现。

图1-1 二维码识别有效区域

二、解决办法：

本次出现的问题是与适配屏幕的<meta name="viewport">标签有关，适配应该调成如下配置：

<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

宽度强制转换成设备宽度，默认缩放比例为1，最大缩放比例1，不允许手动缩放。

   前台在整合手机端H5活动详细页面的时候出现上面的问题，由于activity_detail_mobile.ftl中引用了activity_mobile_rem.js，它里面加了下面这句话, 动态的改变了适配器，将它删掉二维码的识别区域就正常了。

$('[name="viewport"]').attr('content',"width=device-width,initial-scale="+scale+",minimum-scale="+scale+",maximum-scale="+scale+",user-scalable=no");