首先,需要打开手机的USB调试和微信的TBS 调试开关。

如果不打开TBS开关,Inspect时会检测不到任何微信的H5页面

使用微信扫码下方二维码,打开TBS调试开关:

普通网页

小程序

微信扫描上方二维码后,会出现以下页面:

等待跳转或点击“开启远程调试开关”

打开Inspect调试,点击确定

然后,打开chrome://inspect,点击Inspect。此时,如果没有Fan墙或使用离线开发者工具包,会出现空白页面:

解决方法:

  方法1. Fan墙

  方法2. 使用使用离线开发者工具包

  方法3. 使用Android的WebView调试工具

如果出现左侧空白,简单修改css样式激活一下就可以了,如下动图演示:

 微信小程序inspect时出来3个页面,有的是打开page-frame.html页面,有的是index.html页面。可以都打开试试,有DOM树的才能显示。例如上图的百度网盘小程序。

Chrome Inspect调试微信出现空白页面的解决方法的更多相关文章

  1. Android通过Chrome Inspect调试WebView出现404页面的解决方法

    无论是调试Web页面还是调试Hybrid混合应用,只要是调试Android的webview,都需要使用Chrome://inspect进行调试.但是国内开发者会出现404 Not Found错误: 解 ...

  2. Android通过Chrome Inspect调试WebView的H5 App出现空白页面的解决方法(不需要FQ)

    本文系博主原创,未经许可不得转载.如未经本人同意,私自转载或盗取资源提供下载,本人保留追究其法律责任的权利. 调试基于WebView的Hybrid App最舒服的工具当然是Chrome自带的开发者工具 ...

  3. Chrome Inspect调试stetho出现空白的解决方法

    stetho可以使用chrome调试webview,有网友反映国内不行,亲测了一下是有解决方法的: Chrome://inspect 打开后会发现stetho的页面: 点击inspect,如果没有Fa ...

  4. Chrome DevTools调试微信X5内核页面

    起因:公司最近在做一个双十一的H5宣传页面,大概需求就是模拟微信视频来电,接通视频后弹出某某明星的视频巴拉巴拉@#%!!!~.看到需求我的第一反应是So easy,正当我码代码码的开心的时候,难题他来 ...

  5. Chrome Inspect调试微信出现404,需要FQ

    要么FQ,要么买个程序 见连接 http://www.cnblogs.com/slmk/p/7591126.html

  6. chrome://inspect调试html页面空白,DOM无法加载的解决方案

    chrome://inspect调试html页面空白,DOM无法加载的解决方案 先描述一下问题 有一段时间没碰huilder hybird app 开发了,今天调试的时候 chrome://inspe ...

  7. 混合开发使用Chrome Inspect调试WebView预览手机界面和定位元素

    使用Chrome Inspect调试混合应用可以帮助我们排查问题.例如定位元素,快速修改CSS样式并实时查看效果.其实微信开发也是一种混合开发模式,微信可以看做一个原生的Android App搭配了一 ...

  8. Cordova/Ionic开发的Android APP启用Chrome Inspect调试的方法

    Cordova/Ionic开发的Android APP,需要启用WebView的调试模式,才可以在Chrome浏览器中输入chrome://Inspect,然后使用大家熟悉的开发者工具进行调试.不启用 ...

  9. HBuilder离线打包启用Chrome Inspect调试

    解决方法: 修改这个文件 assets/data/dcloud_control.xml <msc version="1.9.9.39354" debug="true ...

随机推荐

  1. Web服务器原理

    ——————————什么是Web服务器  Web服务器一般指网站服务器,是指驻留于因特网上某种类型计算机的程序,可以向浏览器等Web客户端提供文档.目前最主流的三个Web服务器是Apache Ngin ...

  2. mysql的坑

    mysql安装报错: 1.The service already exists! The current server installed: 因为mysql卸载不完全. 解决方法: C:\window ...

  3. Prime Distance POJ - 2689 (数学 素数)

    The branch of mathematics called number theory is about properties of numbers. One of the areas that ...

  4. 动态规划——Best Time to Buy and Sell Stock III

    题意:用一个数组表示股票每天的价格,数组的第i个数表示股票在第i天的价格. 如果最多进行两次交易,但必须在买进一只股票前清空手中的股票,求最大的收益. 示例 1:Input: [3,3,5,0,0,3 ...

  5. [POJ1220]NUMBER BASE CONVERSION (高精,进制转换)

    题意 任意进制之间的高进的转换 思路 相模倒排,高精处理 代码 我太弱了,下面附一个讨论里发的maigo思路的代码 ],A[]; ],d[]; main(){ for(scanf("%d&q ...

  6. css 定位布局

    文档流: 文档流,是指盒子按照html标签编写的顺序依次从上到下,从左到右排列.块元素占一行,行内元素在一行之内从左到在排列,先写的先排列,后写的排在后面,每个盒子都占据自己的位置. 关于定位: 可以 ...

  7. K个排序链表的合并(Hard)

    问题来源:选自leetCode 23:合并K个排序链表 问题描述: 题目给定信息: 不确定需要合并的链表的数目,但依然要求我们把给定的这些有序链表合并成一个链表,并且保证合并的链表依然是有序的. 问题 ...

  8. 在Windows上安装Nexus 3.2.0-01

      在Windows上安装Nexus 环境: Windows 7 apache-maven-3.3.9 JDK 1.8 下载Nexus: https://sonatype-download.globa ...

  9. Web Service学习(一)

    1.WebMethod特性包含哪些属性,都有什么用? 1.BufferResponse属性 该属性表明是否启用对Web Service方法响应的缓冲.当设置为true时,Web Service方法将响 ...

  10. PAT甲级1078 Hashing【hash】

    题目:https://pintia.cn/problem-sets/994805342720868352/problems/994805389634158592 题意: 给定哈希表的大小和n个数,使用 ...