禁止微信内置浏览器调整字体大小

Posted 2020-10-13 CassielPang

微信webview内置了调整字体大小的功能，用户可以根据实际情况进行调节。但是很多移动端页面的开发都是使用rem作为单位的，字体大小改变以后，会出现页面布局错乱的情况，因此希望能够禁止微信的字体放大功能，下面是通过查找资料找到的一些解决方法。

1.安卓手机禁止微信客户端修改字体大小

<!-- 强制禁止用户修改微信客户端的字体大小---begin--- -->
<script>
       (function() {

           if (typeof WeixinJSBridge == "object" && typeof WeixinJSBridge.invoke == "function") {
               handleFontSize();
           } else {
               if (document.addEventListener) {
                   document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
               } else if (document.attachEvent) {
                   document.attachEvent("WeixinJSBridgeReady", handleFontSize);
                   document.attachEvent("onWeixinJSBridgeReady", handleFontSize);  }
           }
           function handleFontSize() {
               // 设置网页字体为默认大小
               WeixinJSBridge.invoke(‘setFontSizeCallback‘, { ‘fontSize‘ : 0 });
               // 重写设置网页字体大小的事件
               WeixinJSBridge.on(‘menu:setfont‘, function() {
                   WeixinJSBridge.invoke(‘setFontSizeCallback‘, { ‘fontSize‘ : 0 });
               });
           }
       })();
</script>
<!-- 强制禁止用户修改微信客户端的字体大小---end--- -->

2.ios系统禁止微信客户端修改字体大小

body { /* IOS禁止微信调整字体大小 */
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
    -moz-text-size-adjust: 100% !important;
}