X5-工作人员 器粉新人
版主
2016-04-14 17:28:20 

【帮助文档】宿主App下TBS Inspector网页调试

 本帖最后由 X5-工作人员 于 2016-05-03 16:02:36 编辑

nspector调试网页(TBS 2.0+方式*


使用Inspector调试宿主App(如微信)中网页的操作步骤如下:
1. 确保adb及手机的连接

打开Command窗口,输入adb,看功能是否正常。

同时,输入adb shell,看adb是否正常连接上了手机:


如果本地没有安装过adb工具,可以安装附件带有的ADB,安装方法:
1)下载并解压附件中的adb-tools.zip到adb-tools目录
2)将adb-tools目录添加到系统的Path环境变量里面

3)再重启系统以生效
2. 安装附件中的TbsSuite工具
    1)打开工具,选择“安装本地TBS内核”
    2)选择App的对的包名
        微信:com.tencent.mm           手Q:com.tencent.mobileqq   
        Demo:com.tencent.x5sdk.demo    QQ空间:com.qzone
    3)点击安装按钮,再点击“打开当前App”。
    4)在App中通过URL(http://debugtbs.qq.com打开调试页面。然后点击安装本地TBS内核。等待安装成功提示。
    5)重启App,再打开网页以启用新版本TBS内核。 
3. 确认打开网页调用了X5内核
      安装成功后,重新再打开网页。长按页面文字时如果能看到如水滴状的选择控件,X5内核就加载成功了,后续的所有网页打开都会走X5内核,就可以进行调试了。

      另外,若成功使用了X5内核,拖住网页下拉时,可以看到“X5内核提供技术支持”的提示,如下图所示:




另外,也可根据页面长按文字的效果来确定是否启用了X5内核。

 如下所示的选项效果“水滴效果”表示启用了X5内核:


4. 启动Inspector调试

    1) 打开 http://debugx5.qq.com 调试界面 -- 信息 -- TBS settings。
    2) 找到启用Inspector功能,勾选成功后,重启App再打开网页。



    3) 再用PC的Chrome浏览器打开网址chrome://inspect,就会看到Device和操作按钮。



就可以进行调试了,如下图所示

已知问题1:
1、Inspector调试微信时,请关闭手Q,QQ浏览器,和其它使用了X5内核的应用。以避免发生端口冲突。
2、基于同样的原因,如果一个App里启动多个进程来使用WebView,那么同时也只能有一个进程可以调试,哪个进程先启动哪个可以调试。

3其它已知问题:
1、断点调试JS时,Scripts一栏无资源文件。解决办法,

        1)点击script


2)点击左下角的这个按钮
        3)在弹出来的控制台,输入location.reload()
        4)如果一直无法出现js,可以点击这个区域试试。

已知问题2:

1. 第一次使用需要挂一下代理,由于第一次使用时需要去拉取一下资源,这个网站(http://chrome-devtools-frontend.appspot.com)被墙了。使用Chrome的SwitchyOmega的插件,配置如下:


2. 如果代理功能正常,仍然不能使用的话,请检查一下你的Chrome版本是不是太旧了,尝试一下作一下升级。
3. 安装代理插件SwitchyOmega.crx。
   下载附件中的SwitchyOmega.crx,在Chrome中打开chrome://extensions, 将刚下载的SwitchyOmega.crx拖到chrome://extensions页面上,即可实现离线安装。
 

参考资料以及相应高级用法:
https://developer.chrome.com/devtools/index


附件:TbsSuite_core_20160303_043219.apk







本帖子中包含更多资源,您需要才可以下载或查看
 本主题由 web爱好者 于 2016-09-21 09:50:58 解除置顶
23 条回复
有容乃大_yxH0qT 器粉跑堂
2016-04-21 12:08:24 沙发
 本帖最后由 有容乃大_yxH0qT 于 2016-04-21 12:09:03 编辑附件中的文件无法解压缩。


zip包和apk包都有问题。



EOCD not found, not Zip
file 'TbsSuite_core_20160303_043219.apk' is not a valid zip file
蒋迪 器粉跑堂
2016-04-22 11:01:03 板凳
  醉了,同楼上,附件有问题



  End-of-central-directory signature not found.  Either this file is not        │
  a zipfile, or it constitutes one disk of a multi-part archive.  In the        │
  latter case the central directory and zipfile comment will be found on        │
  the last disk(s) of this archive.
星星知我心_NVCYWc 器粉跑堂
2016-04-24 02:33:18 地板
如何使用哪位老师能教我?
放宽心看开点 器粉跑堂
2016-04-24 19:04:54 4#
 本帖最后由 放宽心看开点 于 2016-04-25 12:59:42 编辑打开adb_tools.zip提示压缩包已损坏。
apk安装提示解析包时出现问题。
能不能好好的玩耍了啊。。。。。。
Coxxs 器粉跑堂
2016-04-24 22:52:01 5#
坏的包发了十天还没发现吗
放宽心看开点 器粉跑堂
2016-04-25 13:00:31 6#
Coxxs 发表于 2016-04-24 22:52:01 
坏的包发了十天还没发现吗

腾讯也就这效率了,咱再等他个十天半个月的吧。
放宽心看开点 器粉跑堂
2016-04-25 13:02:57 7#
有容乃大_yxH0qT 发表于 2016-04-21 12:08:24 
附件中的文件无法解压缩。


zip包和apk包都有问题。



EOCD not found, not Zip
f ...

1、微信访问地址:http://debugtbs.qq.com,打开页面后,点击第二个按钮【安装线上TBS内核】,等待下载,安装完成,然后TBS内核就安装完成了,预想可以不用他这个附件了。
2、adb_tools.zip使用我发的附件吧。


放宽心看开点 器粉跑堂
2016-04-25 13:03:28 8#
1、微信访问地址:http://debugtbs.qq.com,打开页面后,点击第二个按钮【安装线上TBS内核】,等待下载,安装完成,然后TBS内核就安装完成了,预想可以不用他这个附件了。
2、adb_tools.zip使用我发的附件吧。


放宽心看开点 器粉跑堂
2016-04-25 13:04:55 9#
Coxxs 发表于 2016-04-24 22:52:01 
坏的包发了十天还没发现吗

1、微信访问地址:http://debugtbs.qq.com,打开页面后,点击第二个按钮【安装线上TBS内核】,等待下载,安装完成,然后TBS内核就安装完成了,预想可以不用他这个附件了。
2、adb_tools.zip使用我发的附件吧。


放宽心看开点 器粉跑堂
2016-04-25 13:05:52 10#
不好意思,之前不知道附件的操作模式,现在补传一份:
本帖子中包含更多资源,您需要才可以下载或查看
景_Pw2sph 器粉跑堂
2016-04-25 14:49:41 11#
放宽心看开点 发表于 2016-04-25 13:04:55 
1、微信访问地址:http://debugtbs.qq.com,打开页面后,点击第二个按钮【安装线上TBS内核】,等待下 ...

线上安装的不是最新的版本,根本用不了!!
裴你看大海 器粉跑堂
2016-05-12 05:54:55 发自手机 12#
放宽心看开点 发表于 2016-04-25 13:05:52 
不好意思,之前不知道附件的操作模式,现在补传一份:

另外一个apk也传下吧,tbs那个
⌘ 桑善 器粉跑堂
2016-05-19 10:55:10 13#
APK 安装提示文件损坏哦
唐兴刚 器粉跑堂
2016-06-17 15:39:05 14#
为什么我到这个步骤的时候打开的页面是空白的

唐兴刚 器粉跑堂
2016-06-17 15:41:12 15#
唐兴刚 发表于 2016-06-17 15:39:05 
为什么我到这个步骤的时候打开的页面是空白的

只显示这个样子
Ec1R 器粉跑堂
2016-06-23 01:45:07 16#
同问。。。
熊猫中人 器粉跑堂
2016-07-18 14:39:09 17#
唐兴刚 发表于 2016-06-17 15:41:12 
只显示这个样子

我这也是~~~
陈强_ako684 器粉跑堂
2016-08-04 00:20:25 18#
怎么用才安全
web爱好者 器粉新人
超级管理员
2016-10-15 16:43:50 19#
唐兴刚 发表于 2016-06-17 15:41:12 
只显示这个样子

请使用TBS Studio调试工具来解决无法显示调试界面的问题:http://bbs.mb.qq.com/thread-1416936-1-1.html
12>
回复

您需要 登录 后才可以回帖