且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Chrome开发者工具里的一个隐藏技能:chrome://net-internals

更新时间:2022-09-11 18:02:52

During my holiday I was writing a small tool for fun, which extracts my personal posts from http://www.baidu.com for further analysis.

I am using AJAX in jQuery to perform a synchronous call to fetch html source code of given url specified by argument requestURL.、


function getPostByAJAX(requestURL){
   var html = $.ajax({
    url: requestURL,
    async: false}).responseText; 
   return html;
}

The requestURL I am using is http://tieba.baidu.com/i/i/my_tieChrome开发者工具里的一个隐藏技能:chrome://net-internalsChrome开发者工具里的一个隐藏技能:chrome://net-internalsChrome开发者工具里的一个隐藏技能:chrome://net-internalsHow to deal with this issue then? Then I found the useful tool from Google: chrome://net-internals

Now let’s continue to trouble shoot with this tool.


(1) type chrome://net-internals in Chrome address bar, press enter key.

Then click Event hyperlink.


Chrome开发者工具里的一个隐藏技能:chrome://net-internals(2) Go to my own html page which will send AJAX request via jQuery, click F5 to send a new request, then go back to Chrome tool.

Now I have found the trace entry for the sent request.

Here below is the request detail which contains much more information compared with the one in Chrome development Tool-Network tab.


Chrome开发者工具里的一个隐藏技能:chrome://net-internalsChrome开发者工具里的一个隐藏技能:chrome://net-internalsThe return code 302 and location “http://static.tieba.baidu.com/tb/error.html?ErrType=1” give me a reminder that this issue might be related to logon state of BAIDU website, since I would like to return my personal information, it makes sense that the url can only return personal data if cookie is available or user credential is specified ( not supported by BAIDU in this case ).

In order to verify my assumption, I request the url directly in Chrome and check its request header fields this time, and yes, the cookie field is there:


Chrome开发者工具里的一个隐藏技能:chrome://net-internalsSo now the question is, how to send my cookie information together with the AJAX call in JavaScript code?

I found this article from Google.

According to the article, I add the following code in my function:


Chrome开发者工具里的一个隐藏技能:chrome://net-internalsAnd it works now:Chrome开发者工具里的一个隐藏技能:chrome://net-internalsBy the way, via this tool I can also figure out how the jQuery library file jquery1.7.1.js stored in local laptop is loaded by Chrome.

Chrome reads this file by chunks with size 32768 ( the file consists of 8 chunks ).



Chrome开发者工具里的一个隐藏技能:chrome://net-internalsThe total size 251661 matches exactly with the number I see in windows, perfect isn’t it?Chrome开发者工具里的一个隐藏技能:chrome://net-internalsFurther reading

For more tips I gained during my daily work about Chrome development tools, please refer to this blog Chrome Development Tool tips used in my daily work.