Home | History | Annotate | Download | only in net_internals
      1 <!DOCTYPE HTML>
      2 <head i18n-values="dir:textdirection;">
      3 <!--
      4 Copyright (c) 2011 The Chromium Authors. All rights reserved.
      5 Use of this source code is governed by a BSD-style license that can be
      6 found in the LICENSE file.
      7 -->
      8   <head>
      9     <link rel="stylesheet" href="main.css">
     10     <link rel="stylesheet" href="tabswitcherview.css">
     11     <script src="util.js"></script>
     12     <script src="view.js"></script>
     13     <script src="tabswitcherview.js"></script>
     14     <script src="dataview.js"></script>
     15     <script src="httpcacheview.js"></script>
     16     <script src="testview.js"></script>
     17     <script src="hstsview.js"></script>
     18     <script src="main.js"></script>
     19     <script src="dnsview.js"></script>
     20     <script src="eventsview.js"></script>
     21     <script src="detailsview.js"></script>
     22     <script src="sourceentry.js"></script>
     23     <script src="resizableverticalsplitview.js"></script>
     24     <script src="topmidbottomview.js"></script>
     25     <script src="timelineviewpainter.js"></script>
     26     <script src="logviewpainter.js"></script>
     27     <script src="loggrouper.js"></script>
     28     <script src="proxyview.js"></script>
     29     <script src="socketpoolwrapper.js"></script>
     30     <script src="socketsview.js"></script>
     31     <script src="spdyview.js"></script>
     32     <script src="serviceprovidersview.js"></script>
     33     <script src="httpthrottlingview.js"></script>
     34   </head>
     35   <body onload="onLoaded()">
     36     <!-- Tab switcher for main categories. -->
     37     <div id=categoryTabHandles>
     38       <ul>
     39         <li><a href="#data" id=dataTab>Data</a></li>
     40         <li><a href="#proxy" id=proxyTab>Proxy</a></li>
     41         <li><a href="#events" id=eventsTab>Events</a></li>
     42         <li><a href="#dns" id=dnsTab>DNS</a></li>
     43         <li><a href="#sockets" id=socketsTab>Sockets</a></li>
     44         <li><a href="#spdy" id=spdyTab>SPDY</a></li>
     45         <li><a href="#httpCache" id=httpCacheTab>HTTP Cache</a></li>
     46         <li><a href="#httpThrottling" id=httpThrottlingTab>HTTP Throttling</a></li>
     47         <!-- Tab is only shown on Windows -->
     48         <li><a href="#serviceProviders" id=serviceProvidersTab style="display: none;">SPIs</a></li>
     49         <li><a href="#tests" id=testTab>Tests</a></li>
     50         <li><a href="#hsts" id=hstsTab>HSTS</a></li>
     51       </ul>
     52       <div style="clear: both;"></div>
     53     </div>
     54     <!-- Proxy info -->
     55     <div id=proxyTabContent>
     56       <h4>
     57         Current proxy settings
     58         <input type=button value="Re-apply settings" id=proxyReloadSettings />
     59       </h4>
     60 
     61       <table><tr>
     62 
     63       <td valign=top>
     64       <h3>Effective settings</h3>
     65       <pre id=proxyEffectiveSettings></pre>
     66       </pre>
     67       </td>
     68 
     69       <td style='width: 30px'>&nbsp;</td>
     70 
     71       <td valign=top>
     72       <h3>Original settings</h3>
     73       <pre id=proxyOriginalSettings></pre>
     74       </td>
     75 
     76       </tr></table>
     77 
     78       <h4>Proxy auto-config initialization</h4>
     79       <ul>
     80         <li>
     81           <a href='#events&q=type:INIT_PROXY_RESOLVER'>View all events</a>
     82         </li>
     83         <li>
     84           Latest proxy resolver event:
     85           <pre id=proxyResolverLog></pre>
     86         </li>
     87       </ul>
     88 
     89       <h4>
     90         Proxies which have failed recently, and are marked as bad
     91         <input type=button value="Clear bad proxies" id=clearBadProxies />
     92       </h4>
     93       <table class="styledTable">
     94         <thead>
     95           <tr>
     96             <th>Bad proxy server</th>
     97             <th>Time for next retry</th>
     98           </tr>
     99         </thead>
    100         <tbody id=badProxiesTableBody></tbody>
    101       </table>
    102     </div>
    103     <!-- Host resolver info -->
    104     <div id=dnsTabContent>
    105       <h4>Host resolver</h4>
    106       <ul>
    107         <li><a href='#events&q=type:HOST_RESOLVER_IMPL_REQUEST%20type:HOST_RESOLVER_IMPL_JOB%20is:active'>View pending lookups</a></li>
    108         <li>Default address family: <span id=hostResolverDefaultFamily></span>
    109           <span id=hostResolverIPv6Disabled class=warningText style="display: none;">
    110             (IPv6 disabled)
    111             <input type=button value="Enable IPv6" id=hostResolverEnableIPv6 />
    112           </span>
    113         </li>
    114       </ul>
    115 
    116       <h4>
    117         Host resolver cache
    118         <input type=button value="Clear host cache" id=clearHostResolverCache />
    119       </h4>
    120       <ul>
    121         <li>Capacity: <span id=hostResolverCacheCapacity></span></li>
    122         <li>Time to live (ms) for success entries:
    123             <span id=hostResolverCacheTTLSuccess></span></li>
    124         <li>Time to live (ms) for failure entries:
    125             <span id=hostResolverCacheTTLFailure></span></li>
    126       </ul>
    127 
    128       <table class="styledTable">
    129         <thead>
    130           <tr>
    131             <th>Hostname</th>
    132             <th>Family</th>
    133             <th>Addresses</th>
    134             <th>Expires</th>
    135           </tr>
    136         </thead>
    137         <tbody id=hostResolverCacheTbody>
    138         </tbody>
    139       </table>
    140     </div>
    141     <div id=socketsTabContent>
    142       <h4>Socket pools</h4>
    143       <ul>
    144         <li><input type=button value="Close idle sockets" id=socketPoolCloseIdleButton />
    145         </li>
    146         <li><input type=button value="Flush socket pools" id=socketPoolFlushButton />
    147           <span class=warningText >May break pages with active connections</span>
    148         </li>
    149         <li><a href='#events&q=type:SOCKET%20is:active'>View live sockets</a>
    150         </li>
    151       </ul>
    152       <p>
    153         <div id=socketPoolDiv>
    154         </div>
    155       </p>
    156       <p>
    157         <div id=socketPoolGroupsDiv>
    158         </div>
    159       </p>
    160     </div>
    161     <div id=spdyTabContent>
    162       <h4>SPDY Status</h4>
    163       <ul>
    164         <li>SPDY Enabled: <span id=spdyEnabledSpan>????</span></li>
    165         <li>Use Alternate Protocol: <span id=spdyUseAlternateProtocolSpan>????</span></li>
    166         <li>Force SPDY Always: <span id=spdyForceAlwaysSpan>????</span></li>
    167         <li>Force SPDY Over SSL: <span id=spdyForceOverSslSpan>????</span></li>
    168         <li>Next Protocols: <span id=spdyNextProtocolsSpan>????</span></li>
    169       </ul>
    170 
    171       <h4>SPDY sessions</h4>
    172         <!-- Only one of these two are shown -->
    173         <span id=spdySessionNoneSpan>None</span>
    174         <span id=spdySessionLinkSpan style="display: none;">
    175           <a href='#events&q=type:SPDY_SESSION%20is:active'>View live SPDY sessions</a>
    176         </span>
    177       <p>
    178         <div id=spdySessionDiv>
    179         </div>
    180       </p>
    181 
    182       <h4>Alternate Protocol Mappings</h4>
    183       <p />
    184         <div id=spdyAlternateProtocolMappingsDiv>
    185         </div>
    186     </div>
    187     <div id=httpCacheTabContent>
    188       <h4>Entries</h4>
    189       <a href="chrome://view-http-cache" target=_blank>Explore cache entries</a>
    190 
    191       <h4>Statistics</h4>
    192       <div id=httpCacheStats>Nothing loaded yet.</div>
    193     </div>
    194     <div id=httpThrottlingTabContent>
    195       <p>
    196       In order to prevent Distributed Denial of Service (DDoS) attacks from
    197       being perpetrated by web pages and extensions that run within Chrome, the
    198       HTTP throttling mechanism keeps track of errors requesting a given URL
    199       (minus the query parameters), and after a few 5xx errors in a row, starts
    200       exponentially increasing an interval during which requests to the
    201       given URL are disallowed.
    202       </p><p>
    203       You may enable or disable the feature below.  Please let us know if the
    204       feature is causing problems for your web site.  More details and contact
    205       information at 
    206       <a href="http://dev.chromium.org/throttling">http://dev.chromium.org/throttling</a>.
    207       </p>
    208       <p><input id=enableHttpThrottlingCheckbox type=checkbox />
    209         Throttle HTTP requests if the server has been overloaded or encountered an error.
    210       </p>
    211     </div>
    212     <!-- Only shown on Windows -->
    213     <div id=serviceProvidersTabContent style="display: none;">
    214       <h4>Layered Service Providers</h4>
    215       <table class="styledTable">
    216         <thead>
    217           <tr>
    218             <th>Name</th>
    219             <th>Version</th>
    220             <th>Type</th>
    221             <th>Socket Type</th>
    222             <th>Protocol</th>
    223             <th>Path</th>
    224           </tr>
    225         </thead>
    226         <tbody id=serviceProvidersTbody>
    227         </tbody>
    228       </table>
    229       <h4>Namespace Providers</h4>
    230       <table class="styledTable">
    231         <thead>
    232           <tr>
    233             <th>Name</th>
    234             <th>Version</th>
    235             <th>Namespace</th>
    236             <th>Active</th>
    237           </tr>
    238         </thead>
    239         <tbody id=namespaceProvidersTbody>
    240         </tbody>
    241       </table>
    242     </div>
    243     <!-- Import/Export data -->
    244     <div id=dataTabContent>
    245 
    246     <table width=100%>
    247     <tr>
    248     <td valign=top>
    249       <div id=dataViewDumpDataDiv>
    250         <h2>Dump data</h2>
    251         <div style="margin: 8px">
    252           <p><input id=securityStrippingCheckbox type=checkbox checked=yes>
    253              Strip private information (cookies and credentials).
    254           </p>
    255           <p>
    256             <a href="javascript:displayHelpForBugDump()">
    257               Help: How to get data for bug reports?
    258             </a>
    259           </p>
    260           <button id=exportToText class=bigButton>Dump to text</button>
    261         </div>
    262       </div>
    263       <div id=dataViewLoadDataDiv>
    264         <h2>Load data</h2>
    265         <div style="margin: 8px">
    266           <p><input type=button value="Load log from file" id=dataViewLoadLogFile /></p>
    267           <p>Only works with log files created with "--log-net-log=file_name".</p>
    268           <p>Once a log is loaded, this page will stop collecting data, and will
    269              only start gathering data again when the page is
    270              <a href="javascript:history.go(0);">reloaded</a>.<BR>
    271           </p>
    272         </div>
    273       </div>
    274     </td>
    275 
    276     <td align=right valign=top>
    277       <div class="capturingBox" id=dataViewCapturingBox>
    278         <span id=dataViewCapturingTextSpan>
    279           <b>Capturing all events...</b>
    280         </span>
    281         <span id=dataViewLoggingTextSpan style="display: none;">
    282           <b>Viewing loaded log file.</b>
    283         </span>
    284         <table style="margin: 8px">
    285           <tr>
    286             <td>Passively captured:</td>
    287             <td align=right id=passivelyCapturedCount></td>
    288           </tr>
    289           <tr>
    290             <td>Actively captured:</td>
    291             <td align=right id=activelyCapturedCount></td>
    292           </tr>
    293         </table>
    294         <p><input type=button value="Delete all" id=dataViewDeleteAll /></p>
    295         <p><input id=byteLoggingCheckbox type=checkbox>
    296             Log actual bytes sent/received.
    297         </p>
    298       </div>
    299     </td>
    300 
    301     </tr>
    302     </table>
    303 
    304     <pre id=exportedDataText></pre>
    305     </div>
    306 
    307 <!-- START OF HELP TEXT -->
    308 <script>
    309 function displayHelpForBugDump() {
    310   // We can't access the popups loaded from WebUI pages, so we instead populate
    311   // its contents using a data:URL. YUCK!
    312   // TODO(eroman): do something less hacky, like exposing a new URL.
    313   var helpContents =
    314       document.getElementById('howtoDumpForBugsHelpContent').innerHTML;
    315   window.open('data:text/html,' + encodeURIComponent(helpContents));
    316 }
    317 </script>
    318 <div id=howtoDumpForBugsHelpContent style="display: none">
    319 <h2>How to get data for bug reports</h2>
    320 
    321 <ol>
    322 <li>Reproduce the network problem.</li>
    323 <li>Click the <i>Dump to text</i> button in the <i>Data</i> tab.</li>
    324 
    325 <li>Copy-paste the resulting selected text to a file.</li>
    326 
    327 <li>Email the text file to the bug investigator,
    328   <b>along with an explanation of what went wrong.</b>
    329 </li>
    330 
    331 </ol>
    332 
    333 
    334 <ul>
    335 <li>The network log <b>may contain personally identifying information</b> like
    336   IP addresses, URLs, and cookies.</li>
    337 <ul>
    338 <li>You can edit the log to obscure information if you like, but sometimes it
    339   is relevant to the bug.</li>
    340 <li>If you choose not to have cookies removed from the log, you must toggle
    341   the checkbox before clicking the button.</li>
    342 </ul>
    343 <li>Ideally you would have the tool running <b>before</b> you reproduce the
    344   bug.
    345   If that isn't possible (perhaps the bug happens unpredictably), then the
    346   next best thing is to load chrome://net-internals/ <b>as soon as you can
    347   after</b> the problem has occurred.</li>
    348 </ul>
    349 
    350 <h2>How it works</h2>
    351 
    352 <ul>
    353   <li>While the net-internals page is open, it will capture the network events
    354   that are happening in Chrome. You can view that in real-time by going to
    355   the <i>Events</i> tab.</li>
    356   <li>Once you close the net-internals window, the data it had captured will be
    357   discarded.</li>
    358 <li>Chrome keeps around a small buffer of the most recent network events
    359   even when the net-internals window is not open. That way if you open
    360   chrome://net-internals/ <b>shortly after</b> encountering a problem,
    361   you may still find the relevant data.
    362   These <i>passively captured</i> events are less accurate however, and will
    363   be prefixed in the log with <span style="font-family: monospace;">(P)</span>.
    364 </li>
    365 </ul>
    366 
    367 <button onclick='window.close()'>Close this popup</button>
    368 <!-- END OF HELP TEXT -->
    369 </div>
    370 
    371     <!-- Connection tests -->
    372     <div id=testTabContent>
    373       <p>Input a URL which failed to load, and then click the button to run some
    374          tests for why it failed.</p>
    375       <form id=connectionTestsForm>
    376         URL: <input type=text id=testUrlInput />
    377         <input type=submit value="Start tests" />
    378       </form>
    379       <div id=testSummary></div>
    380     </div>
    381 
    382     <!-- HSTS tab -->
    383     <div id=hstsTabContent>
    384       <p>
    385         HSTS is HTTPS Strict Transport Security: a way for sites to elect to
    386         always use HTTPS. See <a href="http://dev.chromium.org/sts">
    387         http://dev.chromium.org/sts</a>.</p>
    388 
    389         <!-- This UI allows a user to query and update the browser's list of
    390              HSTS domains. -->
    391 
    392       <h4>Add domain</h4>
    393 
    394       <p>Input a domain name to add it to the HSTS set:</p>
    395       <form id=hstsAddForm>
    396         Domain: <input type=text id=hstsAddInput type="url"
    397                  placeholder="example.com"/><br/>
    398         Include subdomains: <input type="checkbox" id=hstsCheckInput /><br/>
    399         Public key fingerprints: <input type=text id=hstsAddPins style="width: 25em;"/><br/>
    400         <p style="font-size: small; color: gray; font-style: italic; margin-left: 2em; max-width: 40em;">(public key fingerprints are comma separated and consist of the hash function followed by a foreslash and the base64 encoded fingerprint, for example <tt>sha1/Guzek9lMwR3KeIS8wwS9gBvVtIg=</tt>)</p>
    401         <input type=submit value="Add" />
    402       </form>
    403 
    404       <h4>Delete domain</h4>
    405 
    406       <p>
    407         Input a domain name to delete it from the HSTS set
    408         (<i>you cannot delete preloaded entries</i>):
    409       </p>
    410       <form id=hstsDeleteForm>
    411         Domain: <input type=text id=hstsDeleteInput type="url"
    412                  placeholder="example.com"/>
    413         <input type=submit value="Delete" />
    414       </form>
    415 
    416       <h4>Query domain</h4>
    417 
    418       <p>Input a domain name to query the current HSTS set:</p>
    419       <form id=hstsQueryForm>
    420         Domain: <input type=text id=hstsQueryInput type="url"
    421                  placeholder="example.com"/>
    422         <input type=submit value="Query" />
    423       </form>
    424       <div style="margin-top: 1em; margin-left: 2em;" id=hstsQueryOutput></div>
    425     </div>
    426 
    427     <!-- ================= Events view =================== -->
    428 
    429     <!-- Filter Box: This the top bar which contains the search box.  -->
    430     <div id=filterBox>
    431       <table width=100%>
    432         <tr>
    433           <td width=1%>Filter:</td>
    434           <td width=98%><input type="search" incremental id=filterInput /></td>
    435           <td width=1% id=filterCount>(1 of 34)</td>
    436         </tr>
    437       </table>
    438     </div>
    439     <!-- Events Box: This the panel on the left which lists the sources -->
    440     <div id=eventsBox>
    441       <table id=eventsListTable cellspacing=0 cellpadding=0 width=100%>
    442         <thead>
    443           <tr>
    444             <td><input type=checkbox id=selectAll /></td>
    445             <td id=sortById>ID</td>
    446             <td id=sortBySource>Source</td>
    447             <td id=sortByDescription width=99%>Description</td>
    448           </tr>
    449         </thead>
    450         <!-- Events table body: This is where request rows go into -->
    451         <tbody id=eventsListTableBody></tbody>
    452       </table>
    453     </div>
    454     <!-- Action Box: This is a button bar along the bottom -->
    455     <div id=actionBox>
    456       <input type=button value="Delete selected" id=deleteSelected />
    457       <input type=button value="Delete all" id=deleteAll />
    458     </div>
    459     <!-- Splitter Box: This is a handle to resize the vertical divider -->
    460     <div id=splitterBox></div>
    461     <!-- Details box: This is the panel on the right which shows information -->
    462     <div id=detailsTabHandles>
    463       <table class=tabSwitcher cellspacing=0>
    464         <tr>
    465           <th id=detailsLogTab>Log</th>
    466           <td class=tabSwitcherSpacer>&nbsp;</td>
    467           <th id=detailsTimelineTab>Timeline</th>
    468         </tr>
    469       </table>
    470       <div class=tabSwitcherLine></div>
    471     </div>
    472     <div id=detailsLogBox></div>
    473     <div id=detailsTimelineBox></div>
    474   </body>
    475 </html>
    476