web爱好者 器粉新人
超级管理员
2015-05-26 17:54:13 

微信、手Q、Qzone之x5内核inspect调试解决方案

 本帖最后由 web爱好者 于 2015-10-12 14:09:46 编辑X5调试最新方法请看教程:http://blog.qqbrowser.cc/

一、微信webview调试方法
 
整个调试链路示意图如下:
 


具体调试环境搭建,请看下面流程分解(以微信调试为例进行阐述)

1、安装微信新版本,使用应用宝进行安装微信最新版,如下图:



2、下载TbsSuiteNew.apk,安装到手机中。【下载地址:http://res.imtt.qq.com///tbs_inspect/TbsSuiteNew.zip】,打开界面如下:



2.1)下一步:保险起见,登录微信后找到自己,聊天窗口输入//******tbs,点发送,如果非首次安装微信的用户,需要修改一下手机的时间,往后调整一天,比如今天是4-11,修改为4-12。如果是首次请忽略

2.2)下一步:下载tbs调试包


【注:应用包名 微信:com.tencent.mm,qq:com.tencent.mobileqq,qq空间:com.qzone

2.3)下一步:启动应用触发tbs静默安装


3、登录微信,用微信访问一个页面,停留1分钟左右,目的是让微信来静默安装刚导入进去的tbs_20150526_021257_inspector.apk
4、页面验证tbs是否安装成功



注:【同时检查/sdcard/tbs/com.tencent.mm目录下tbs_*_inspector.apk是否消失,消失表示已经安装成功,长按页面文字是否有水滴
5、debug关联chrome inspect

     a) 下载附件inspector_client20150401.zip工具,解压到指定目录,参考位置如下图:


    

b) 下载python for window:https://www.python.org/downloads/



下载安装完成,配置环境变量


cmd命令模式下进行:



c)解压inspector_client20150401.7z包到指定目录,cmd命令下切换至解压目录,执行python inspector.py,【如果您本机已经安装了adb,建议使用python inspectory --adb YOUR/ADB/PATH】如图





     d)手机用微信打开页面,同时pc电脑打开chrome浏览器,输入http://localhost:9222/,看到对应的区块
     

点击进去终于可以在微信页面上自由调试了,和chrome调试就是那么像。

二、手Q webview调试方法

    和微信webview调试方法基本一致
小提示:
     1、应用宝安装手机QQ应用软件
     2、和微信方式类似,将对应的tbs_20150526_021257_inspector.apk放置在手机内存卡对应目录tbs/com.tencent.mobileqq(放在手机的文件管理tbs/com.tencent.mobileqq)
     3、其他和微信的调试方法大致相同,就不在重复

三、补充调试遇到的问题

    1、针对小米2手机从应用宝安装最新的手Q,无法建立adb连接通信,暂时请使用附件提供的5.5.0的手Q安装包。

附件包下载地址:http://res.imtt.qq.com///tbs_inspect/wx_sq_webview_debug.zip  (!!!注:里面包含inspector_client20150401.zip)
54 条回复
别想我的兔毛大衣~ 铁杆器粉
最佳新人 灌水之王
2015-05-26 21:51:11 发自手机 沙发
扫荡
Wiz666 器粉跑堂
2015-05-28 10:53:28 板凳
在手机中找不到这个目录。  sdcard/tbs/com.tencent.mm 是要自己创建吗?
web爱好者 器粉新人
超级管理员
2015-05-28 11:25:31 地板
Wiz666 发表于 2015-05-28 10:53:28 
在手机中找不到这个目录。  sdcard/tbs/com.tencent.mm 是要自己创建吗?

先检查是否该目录,没有的话,自己创建一个
Wiz666 器粉跑堂
2015-06-01 12:05:11 4#
在使用中发现,调试工具看不到cookies信息,这个正常吗?
提拉米苏_CJS1Qm 器粉跑堂
2015-06-07 15:03:11 5#
inspector_client20150401.7z 附件在哪儿呢
web爱好者 器粉新人
超级管理员
2015-06-08 19:43:57 6#
提拉米苏_CJS1Qm 发表于 2015-06-07 15:03:11 
inspector_client20150401.7z 附件在哪儿呢

在附件包下载里面对应inspector_client20150401.zip
思想狂人 器粉跑堂
2015-06-09 00:47:07 7#
请问下,MAC下 "5、debug关联chrome inspect"这一步怎么操作? 运行:python inspector.py 报错:



Password:
Traceback (most recent call last):
  File "inspector.py", line 104, in <module>
    retCallAdb = call(adbCmd)
  File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 522, in call
    return Popen(*popenargs, **kwargs).wait()
  File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 709, in __init__
    errread, errwrite)
  File "/System/Library/Frameworks/Python.framework/Versions/2.7/lib/python2.7/subprocess.py", line 1326, in _execute_child
    raise child_exception
OSError: [Errno 13] Permission denied
思想狂人 器粉跑堂
2015-06-09 00:48:50 8#
过了眼代码,貌似现在只支持win,什么时候出mac版?急求
DoubleSeven 器粉跑堂
2015-06-17 01:20:51 9#
几个问题。
1,我是Android 5.0的,是否也能装呢?我试了半天貌似不行。
2,我是Mac的系统,支持吗?
3,我发现,我没装之前,flexbox是不支持的,我安装tbc(总验证不成功)后,flexbox又支持了...这让我如何是好...
Leonard 器粉跑堂
超级管理员
2015-06-17 11:12:19 10#
思想狂人 发表于 2015-06-09 00:47:07 
请问下,MAC下 "5、debug关联chrome inspect"这一步怎么操作? 运行:python inspect ...

由于没有执行权限导致,sudo chmod +x ./platforms/mac/adb,增加执行权限即可。


建议使用./inspector.py --adb Your/ADB/Path
Leonard 器粉跑堂
超级管理员
2015-06-17 11:12:52 11#
思想狂人 发表于 2015-06-09 00:48:50 
过了眼代码,貌似现在只支持win,什么时候出mac版?急求

win, linux, mac下这套脚本都是可以使用的。
DoubleSeven 器粉跑堂
2015-06-17 18:14:56 12#
inspector_client20150401.zip,找不到这个文件的下载地址啊。
DoubleSeven 器粉跑堂
2015-06-17 23:39:47 13#
 本帖最后由 DoubleSeven 于 2015-06-18 00:38:17 编辑终于搞定Mac上的调试了。多谢腾讯群中各位大牛的帮忙例如,郑清、Yngwie、晴明等等。
下面,我来说说我成功的过程。我是做微信中webapp的,已经2年没碰过前端的我,再拾起代码,也是需要勇气的。而我的需求,就是能够在电脑上调试手机的页面。因为是Mac,全程需要输入命令,所以,终端界面是不可避免的。在Application中其他那个合集里面。

首先,请大家先将微信上的聊天记录备份。为何要备份?因为你需要重新安装下微信,否则TBS可能会安装不上去!一定要先卸载再重新安装。重新安装完毕后,立即开始装TBS,基本上就没什么问题了。我特地从微信6.2版降级到了6.1版。为何?因为我是做webapp的,我怎么知道我的用户用的哪一版微信?我肯定就低不就高啊。

前面这个都是很好办的。下面的路途就不是那么顺利了。听我慢慢说。首先,主帖上提到了这个工具inspector_client20150401.zip,我找了半天没找到,后来询问,才知道,主帖最下方的链接就是。下载下来,解压缩,里面有2个文件,一个就是上面提到的inspector_client20150401.zip,另外一个是与QQ浏览器相关的apk,因为我不做QQ浏览器上的,所以也就没关心。解压缩inspector_client20150401.zip后,将解压后的文件夹,拷贝到一个利于找到它的位置,我的位置是 ~/Work/worktools/。

放好后,去下载python的mac版本,官网链接在这里:https://www.python.org/downloads/,记得要下载3.4+的版本哦。下载好后,将其安装吧。这时候有朋友会说,笨蛋,Mac自带python的。是的,但是其自带的版本是2.7版本的,我们这次要用的2.7好像不够,所以,用新版本肯定不错。装好后,执行下python试试,是不是仍然显示的2.7版本?我明明装的是3.4+啊。怎么办?没事,我们替换一下即可。这里是替换的攻略,作者已经写的非常详细了,我就不写了。我唯一不一样的是第一步,没有将老版本删除,而是直接将3.4搬到了python的文件中。升级后,再输入python试试,是不是3.4了呢?那恭喜你,你离成功又近了一步。

ADB,不少人可能都没听说过,其是Android手机中非常重要的一个运行器,root等等都需要它。而它,也是帮助Android手机和Mac通讯的工具和桥梁。Mac上默认是没装的,如果你用Mac做过Android开发的话,那你应该比较清楚。我只针对那些没做过的哦。搞定ADB之前,你先要去下载一个Android的SDK Manager,地址在这里。下载里面的stand-alone sdk tools。然后不要迟疑,解压缩,放的位置嘛,还是一个比较好找到它的位置。你以为这样就OK了?那你错了。ADB根本不在里面。打开android-sdk-macosx/tools,里面有个Android的可执行文件,双击它。它打开了一个窗口,还有一堆的列表。通过这里可以下载各种版本的Android SDK,你默认的会装好里面的Android SDK Tools,而你需要的是安装其下面的Android SDK platform-tools!千万别装错,也千万别不装。因为,ADB就在这里面!!不装,后面配环境等等都是白搭!装好后,你会发现android-sdk-macos下面,多了一个文件夹platform-tools,ADB终于在面前了。

下面,我们先配一下ADB的环境变量。打开终端,回到根目录,输入vim ~/.bash_profile(vim的操作,网上有很多,简单学学就OK)。对,你没看错,python的环境变量已经在里面了。下面就在里面,照着python,输入ADB的环境变量吧。PATH="/Users/Adrian/Work/worktools/android-sdk-macosx/platform-tools:${PATH}"。保存退出。输入source .bash_profile,执行一下环境变量,然后输入下adb,是不是出现了一堆的参数说明?OK,那ADB的环境变量就配置好了。

拿出数据线,插上手机,连接电脑,输入adb devices,如果出现了类似下面的代码,说明,你离成功又进了一步。

* daemon not running. starting it now on port 5037 *
* daemon started successfully *
List of devices attached 
NX505J        device


如果没有出现,没事,估计你的手机没有被认出来。下面我们来找回我们的手机。具体的教程在这里,大家也可以参考一下。仔细照着做,也不会有问题。如果还不行,甚至报ADB server didn't ACK,那么有几种可能,1种是刚刚教程中的adb_usb.ini写的有问题,大家可以参考下这文章,试试。如果不是,那么有可能是端口被占用了,或者看看这文章。如果还不行,那么我也不太清楚了。

下面,万事俱备只欠东风了。我们可以开始试试用python调用adb了。还记得前面的文件夹inspector_client20150401吗?进去后,直接输入python ./inspector.py,有极大的可能性报错,因为,权限不够。如何加权限呢?前面的跟帖上说了,输入sudo chmod +x ./platforms/mac/adb。然后再试试python ./inspector.py就应该OK了。下面,你就可以在chrome中调试微信页面了。

期间研究了很久。ADB之类的要多杀进程,多单独启动。一旦单独启动OK,后面很多问题都好办很多。我当时配了好长时间环境变量配不起来,就是因为Android SDK platform-tools没装,而网上配环境变量,几乎都指上这里。

希望大家能够多多的细心加耐心,就肯定能够搞定。我也是一个下午+晚上搞定的。再次谢谢腾讯的各位大大!
那一抹笑╰’穿透阳光 器粉跑堂
2015-06-18 00:16:40 14#
不用怎么麻烦,我连上WiFi,就发现浏览器内核变了
DoubleSeven 器粉跑堂
2015-06-18 00:39:15 15#
那一抹笑╰’穿透阳光 发表于 2015-06-18 00:16:40 
不用怎么麻烦,我连上WiFi,就发现浏览器内核变了

那你运气好,我昨天晚上折腾了半天都不行。今天卸载重装,完全OK。
Anson_ArEKej 器粉跑堂
2015-06-26 10:30:35 16#
DoubleSeven 发表于 2015-06-17 23:39:47 
终于搞定Mac上的调试了。多谢腾讯群中各位大牛的帮忙例如,郑清、Yngwie、晴明等等。下面,我来说说我成功的过程。我是 ...

你好,我也是用Mac做调试的,然后也可以检测到设备


但是到最后的步骤运行python时却报告找不到设备


这是什么原因呢?可以怎样解决?
DoubleSeven 器粉跑堂
2015-06-29 00:58:56 17#
Anson_ArEKej 发表于 2015-06-26 10:30:35 
你好,我也是用Mac做调试的,然后也可以检测到设备但是到最后的步骤运行python时却报告找不到设备这是什么原因呢?可以 ...

我觉得你可能还是因为没有修改好配置文件的原因,一定要修改正确,否则会出现找不到设备的问题。然后,一根好的数据线也很重要,否则也会出现哦~
  高级器粉
2015-06-29 02:20:07 发自手机 18#
路过
  Hifor   器粉跑堂
2015-07-02 11:33:50 19#
prompt
未安装完成,请等待或重试


一直都是上面的提示
手机:小米2
andorid:5.0.2 LRX22G
微信:6.2.2
回复

您需要 登录 后才可以回帖