调试android chrome web page简明备忘

必备工具 adb tools、android chrome

先开启手机调试模式

adb forward tcp:9919 localabstract:chrome_devtools_remote

成功会提示
* daemon not running. starting it now on port 5037 *
* daemon started successfully *
不成功的话用这个命令再试
adb kill-server

接着打开下面的链接，这里的9919是上面adb命令中指定的

http://localhost:9919/

会看到这样的一个个链接：

http://chrome-devtools-frontend.appspot.com/serve_rev/@176236/devtools.html?ws=localhost:9919/devtools/page/1

由于众所周知的原因appspot是在异次元空间，我们需要用成本地的调试器

将...devtools.html替换成本地的chrome-devtools://devtools/bundled/devtools.html

chrome-devtools://devtools/bundled/devtools.html
这个地址可能会不一样
可以用弹出窗口的方式打开调试器
在弹出来的调试器中按ctrl+shift+i来调试调试器，在新的调试器获得这个地址
(很拗口，但就是这样)

有了正确的本地调试器地址后，可以用脚本替换一下

var tabs = document.querySelectorAll('a'),
	localDevAdd = 'chrome-devtools://devtools/bundled/devtools.html';

for (var i = 0; i < tabs.length; i++) {
	if (tabs[i].href && tabs[i].href.indexOf('/devtools.html') > -1) {
		tabs[i].href = tabs[i].href.replace(/.*devtools.html/, localDevAdd);
	}
}

点击对应的tab就可以看到调试器了。

图文版 http://www.tuicool.com/articles/ZJfeAzi