webview设置致使app内嵌网页布局乱掉的其中一种问题解决

对app内嵌网页接触很少，这里描述的是一种内嵌网页布局乱掉的可能缘由：

关键字：“webview控件”、“setUseWideViewPort属性”、“meta标签”

参考文章： Android开发填坑之setUseWideViewPort

情景

1. 近期接到一个bug反馈，说一份网页代码放在一个第三方提供的app内显示布局乱掉了，可是这份代码在手机端浏览器是能够正常显示的；

简单的处理过程

1. 简单review代码，发现是经过动态修改meta标签实现的自适应，在手机端浏览器或者公司的app内打开这个网页都是ok的，看一下有bug的app内页面效果，感受貌似是缩放的问题；

2. 查了下这个app内webview的UA，发现是很常规的webkit内核，不是浏览器内核的问题，而后我回过头修改代码，换些写法，更改自适应meta标签的实现，或者改用rem单位，或者采用scale缩放，都不能达到我想要的效果，换种思路；

3. 整体来讲，这份代码应该问题不大，由于在公司开发的app内，手机端浏览器都是正常显示的，那同一个手机，为何在第三方开发的那个app内打开这个网页就不行了呢？怀疑比较大几率是他们的安卓的设置不搭，询问安卓同事，说安卓能够对webview控件作一些参数的设置，包括缩放等一堆设置；

4. 联系第三方app的安卓，总的一句话就是，为何一样一份网页代码在咱们APP内能够，在大家APP内就不行了，怀疑大家的webview参数设置不一样，比照下咱们的参数应该就能找到问题；

5. 经过比较发现是这样子一个参数没作设置,这个参数文档上说是关于webview控件是否支持<meta>标签的viewport属性，最后安卓开发添加该参数后，布局错乱问题解决；

webSettings.setUseWideViewPort(true);
复制代码

---

至此问题解决

关于调试app内嵌网页的简单拓展思路

1. 由于第三方app很差改安卓的代码，或者说让他们打一个测试的包，因此须要调试内嵌web页面能够考虑经过更改Host域名指向的方法实现，将跳转的路径指向本身的测试地址；