HttpWatch 7.0 帮助文档整理

1Getting StartedOpening the HttpWatch Browser Plug-inYou can display the HttpWatch plug-in in the lower part of the Internet Explorer (IE) or Firefox window by following the instructions shown below:Opening the HttpWatch Plug-in in IE 6Click on the HttpWatch toolbar button:or select it from the View menu:If neither of these options is available please restart Windows and try again. The plug-in can also be opened using Shift+F2 (see Using Keyboard Shortcuts).Opening the HttpWatch Plug-in in IE 7 or 8Click on the HttpWatch toolbar button which is normally on a hidden part of the IE Command Bar. You need to click on the toolbar chevrons (>>) before clicking on the HttpWatch button:or by selecting it from the Tools->Toolbars->Explorer Bar menu:If neither of these options is available please restart Windows and try again. The plug-in can also be opened using Shift+F2 (see Using Keyboard Shortcuts).The position of the HttpWatch button on the Command Bar can be changed using the Tools->Toolbars->Customize... menu item:If you move the HttpWatch toolbar button up:It can then be accessed more easily in IE:Opening the HttpWatch Plug-in in Firefox 2.0 - 3.6Click on the HttpWatch Tools menu item or status bar icon:If neither of these options is available please restart Firefox and check that HttpWatch is not disabled in Tools->Add-ons. The plug-in can also be opened using Shift+F2 (see Using Keyboard Shortcuts).Recording HTTP and HTTPS trafficOnce you have HttpWatch displayed in the browser, press the Record button to start recording HTTP requests.If you are using the free Basic Edition then extended HTTP information is only displayed for sites in the Alexa Top 20 or .HttpWatch includes an offline log file viewer known as HttpWatch Studio. It can be started from the HttpWatch program group under the Start menu or by double clicking on a .hwl file.2What's newNew in Version 7.0Page Level EventsPage level time charts now include lines to indicate when events were raised during the loading of a page:Improved Grouping of Requests during Page LoadRequests occurring after the page onload event are now grouped with the requests recorded during the initial loading of the page:HttpWatch Detects and Highlights Potential ProblemsHttpWatch now examines each request and issues warnings where problems relating to performance, security or functionality are detected. Requests that have warnings are highlighted with a new Warning column marker:and a new request level Warnings tab shows the details of each potential problem:There's also a new Warning tab in the Summary window that summarizes the occurrence of each type of warning in a page or set of selected requests:Customizable Grid ControlsRight clicking on a grid's column headers opens a customization menu:For example, you may want to increase the font size if you are using HttpWatch in a demonstration:New Data Columns in the Request GridThere's now more than thirty columns to choose from in the main request grid covering almost every data item that is available in HttpWatch:Customizable CSV ExportThe CSV output now can now be customized to include the data fields that you need:Data Tips Help You Understand The Recorded DataData tips are now displayed when you hold the mouse pointer over an item such as an HTTP status code:Or a header value saving you the trouble of looking up what the value means:New Icon Based Type ColumnThe new icon based type column saves space and provides an instant visual marker for different types of content. The data tip shows the underlying mime type:Coloring of Result Column ValuesThe result column now uses red to indicate errors and gray for (Cache):More Information About CookiesThe cookie tab now displays the HttpOnly and Secure flags for each cookie; including cookie values that were sent to the server. The source column shows whether the cookie value was returned from the server, set by Javascript or saved in the cookie store by a previous session:Improved Support For HAR FilesHTTP Archive (HAR files) can now be:∙Saved as HttpWatch log files (.hwl)∙Open using the HttpWatch automation interface∙Re-exported in CSV or XML formatsImproved Automation InterfaceThe automation interface allows HttpWatch to be controlled from programs written in almost any programming language (e.g. C#, , Ruby, Javascript). In version 7.0, this interface has been extended with new classes, properties and methods to support:∙Page level events∙Warnings∙Export of customized CSV output∙HTTP Archive (HAR) filesImage dimensionsThe documentation is also improved with a new format and object relationship diagrams:Uploaded File Type on POST Data tabThe content type of uploaded files is now shown in a separate column in the POST Data tab:3Version HistoryVersion 7.0.23∙Fixed: HAR files with a BOM marker can now be opened in HttpWatch∙Fixed: An access violation occurred when attempting to open a HAR file with no page groups∙Fixed: More than three fractional digits are now accepted for the seconds value in ISO8601 date/time strings when importing HAR filesVersion 7.0.22∙Improved: Added a 'Using Ruby' section to the HttpWatch Automation Reference help file ∙Fixed: Corrected typos and broken links in help files∙Fixed: An error message is no longer displayed by HttpWatch when nesting Firefox within a tab using the URL 'chrome://browser/content/browser.xul'Version 7.0.21∙Fixed: The error 'Invalid Seek offset' could be displayed when opening a log file in HttpWatch Basic EditionVersion 7.0∙New: Page event timings are now displayed in the the time chart with tooltips∙New: Added 'Page Events' to page summary window∙Improved: Requests that occur before and after the page load event now appear in a single page group∙New: Added a warning column that displays a ! for any request where a warning was issued (see Warnings section below for more information). The tool tip for the ! displays a short summary of the warnings found on the request∙New: Added a Warnings tab to display the warnings found on a request∙New: The summary window now contains a Warnings tab∙New: Right clicking on a column heading in the main grid displays a content menu of customization options∙New: Added Tools->Warnings dialog that can be used to disable individual warnings. Also available from the context menu on a warning∙New: The columns used in the main grid can be changed using the 'Select Columns' option in the grid header context menu∙New: Columns can be reordered by dragging∙New: The font used in the main grid can be changed using the 'Font...' option in the header context menu. If you choose a larger font the grid text, headings and data tips are scaled up making it useful for demos∙New: Tooltips have been added to all grid column headers to explain what the grid is displaying∙New: Data tips display explanations of certain data values (e.g. result codes) and HTTP header names∙New:Send by Email, Export CSV, Export HAR and Export XML are now available for HAR files in HttpWatch Studio∙New: Added a Type column to the POST Data tab to show the content type of uploaded files ∙New: The Result column value for failing request is colored red and (Cache) results are grayed∙New: Secure, HttpOnly and Source columns added to Cookie grid∙New: Added Tools->Options->CSV Export to allow customization of fields in CSV export files∙New: The Type column now uses icons to indicate content type. The text based column is still available as the 'Content Type' column in the Select Columns window∙New: Can now save a HAR file as a HWL file∙Changed: Has a new version 7.x HWL file format∙Changed: Renamed 'Performance' summary tab to 'Network'∙Changed: Can no longer load HWL files saved with HttpWatch version 4.x4Plug-in for Internet Explorer and FirefoxUsing the HttpWatch Plug-inWhen HttpWatch is installed, it adds a plug-in to Internet Explorer and Firefox that can be used to record and view HTTP requests. The plug-in window can be opened by clicking on the HttpWatch icon(see Getting Started ).The HttpWatch plug-in window consists of three sections:ToolbarThe toolbar is displayed at the top of the window and contains buttons that are used to control HttpWatchRequest GridThis displays a scrollable list of HTTP requests that have been recorded by HttpWatch.Request ViewSelecting an item in the requests grid causes the lower part of the HttpWatch window to display detailed information about that item. The size of this region can be adjust by dragging the horizontal line that separates it from the requests grid.Recording HTTP requests with HttpWatchThe basic steps required to control logging are as follows:1.In Internet Explorer or Firefox open the HttpWatch window by clicking on the icon or byselecting it from the menu (See Getting Started).2.Click the Record button to start recording HTTP requests.e the browser to interact with the web site you want to examine. Whilst doing this,you can close the HttpWatch window and it will carry on logging requests in thebackground.4.Individual requests can be viewed by selecting them in the request grid.5.The log can be emptied using the Clear button or logging can be halted with the Stopbutton.You can avoid logging certain types of requests by using the filter. For example, if you are only interested in the pages returned by a site and not the images you would do the following:1.Open the Filter dialog by clicking on the Filter button.2.Enable filtering by clicking on the Enable filtering check box3.Control the type of HTTP request that is logged by clicking on the Content is: checkbox and clicking on the first check box marked text/html.This will restrict HttpWatch to only recording HTTP requests that return HTML content. For more information see Using the Filter.Saving the LogThe Save button in HttpWatch allows the log to be saved as a .hwl file and loaded into HttpWatch Studio at a later date (See Save button ). The log can also be exported as an XML or CSV file.4.1Toolbar ButtonsThe main toolbar is used to control HttpWatch and contains the following buttons:∙Record∙Stop∙Clear∙View∙Summary∙Find∙Filter∙Save∙Print∙Tools∙LicenseRecordClicking this button will start recording requests in the HttpWatch.StopClicking this button will stop requests being logged.ClearClicking this button clears the contents of the log.ViewClicking this button will open the View menu and display menu items that control the appearance and behavior of the HttpWatch request grid.SummaryClicking this item shows or hides the Summary View.FindClicking this button will open the Find dialog and allow text to be quickly located anywhere in the log of requests.FilterClicking this button will open the Filter dialog and allow requests to be filtered by content type.SaveClicking this item saves the complete log to an HttpWatch log file (.hwl). The Open using HttpWatch Studio checkbox can be used to automatically load the log file into the HttpWatch Studio after it has been saved.The arrow on the toolbar next to this button provides access to Export to CSV... , Export to XML..., Export to HAR... and Send by Email...HttpWatch log files can be reopened using File->Open in HttpWatch Studio or by double clicking on a .hwl file.If you are using HttpWatch Professional Edition, the files you save can be viewed in HttpWatch Basic Edition and you can view the complete contents of files saved in HttpWatch BasicEdition. For more information about transferring log files please see Basic vs Professional Edition.PrintClicking this item opens the Print dialog.ToolsClicking this button will open the Tools menu and display menu items that allow cookies and cache entries to be cleared.LicenseClick this button to set or change the HttpWatch license key.4.2View MenuThe View menu offers the following commands:4.3 Tools MenuThe Tools menu offers the following commands:4.4Options DialogOptions Dialog TabsThe options dialog contains three tabs that can be used to configure the HttpWatch plug-in:1.General2.Recording3.CSV ExportGeneral OptionsThe General tab of the Options dialog contains the following options to configure HttpWatch:Clear log when recording startsIf this check box is selected the log is automatically cleared whenever recording is started interactively.Confirm Cache and Cookie ClearingThis controls whether a confirmation dialog is displayed when one of the clearing options is used on the Tools menu.Use shortcut keys in Internet Explorer / FirefoxClear this check box if you want to disable the use of shortcut keys in the browser. You may need to do this if an HttpWatch shortcut key clashes with a shortcut key used by a web application.Allow shortcut keys that open HttpWatchClear this check box if one of the shortcuts that open HttpWatch (e.g. Shift+F2 for Dock) is interfering with the use the keyboard shortcuts provided by the browser or a web applicationOnly allow other shortcut keys if HttpWatch is openWhen this check box is enabled, shortcut keys that do not open HttpWatch will only be processed if the HttpWatch plugin window is visible. By clearing this option you could perform an action like starting recording (Ctrl+F2) without opening HttpWatch.Recording OptionsUse Record button to start recordingThis is the default setting when you install HttpWatch. Recording is only started when you click on the record button and will continue until the Stop button is clicked.Start Recording when HttpWatch is openedIf this option is enabled HttpWatch will automatically start recording as soon as the Plug-in window is opened.Stop Recording when HttpWatch is closedThis options causes HttpWatch to stop recording when the Plug-in window is closedAutomatically Record when IE/Firefox StartsUsing this options enables automatic recording in HttpWatch, unless the browser was started using the automation interface's New method. The automatic record and saving settings are used when the next instance of the browser starts.Confirmation MessageEnabling this check box causes a confirmation message to be displayed to the user when the browser starts asking them whether they want to proceed with automatic HttpWatch recording. This setting can only be disabled in HttpWatch Professional Edition.Save Log file when IE/Firefox closes or every N minutesThis option can be used to automatically save the HttpWatch log file when the browser exits or after a period of time specified in minutes.If the value in minutes is set to 0 the log file is only written out when IE or Firefox exits. No log file is written out if the log is empty.Write Log files toAutomatically saved log files are written to this location. The following locations are support:∙Local directories, e.g. C:\LOGFILES∙Network paths, e.g. \\DEVSERVER\LOGFILES∙The temporary directory for the current user. Leave the field blank to do thisThe file name is automatically generated and contains the date/time, user name and computer name. See Automatic Recording for more information.Automatically purge log files older then N daysIf this option is selected any log files older than the specified value in days are deleted from the directory used for automatic saving. The deletion occurs just before a new log file automatically saved by HttpWatch. Only log files written by the same user on the same computer will be deleted. If any other HttpWatch log files are present in the directory they will not be deleted.CSV Export OptionsThe same fields as HttpWatch request grid:Select this option to use the columns from the request grid as CSV export fields.These fields:Select this option to manually configure which fields should be used for CSV export. Once the option is selected you can setup the fields using the Change and Reset buttons.Change...Clicking on this button opens the CSV field selection dialog. You can then choose exactly which fields should be included in the CSV output.ResetClick this button to copy the list of fields in the HttpWatch request grid into the list of manually selected fields.The same data as HttpWatch version 6.x and earlierThis options causes CSV export to use the same format as previous versions of HttpWatch.4.5Using Keyboard ShortcutsKeyboard shortcuts in HttpWatchTo do this Press thisOpen a docked HttpWatch window Shift+F2Close the HttpWatch window Shift+F8Undock the HttpWatch window Shift+F3Hide/Show the HttpWatch window Shift+F7Start recording Ctrl+F2Stop recording Ctrl+F3Clear all requests Ctrl+DelOpen Filter dialog Ctrl+F9Hide/Show the Summary window Shift+F9Hide/Show the Properties window Shift+F12Turn on filter Ctrl+F7Turn off filter Ctrl+F8Previous highlight Ctrl+Up ArrowNext highlight Ctrl+Down Arrow Save Ctrl+Shift+SExport to XML Ctrl+Shift+XExport to CSV Ctrl+Shift+C Collapse All Ctrl+Shift+Left Arrow Expand All Ctrl+Shift+Right Arrow Clear Cache and All Cookies Alt+DelClear Cache Alt+CClear All Cookies Alt+KOpen the Options window Alt+OOpen the Warnings window Alt+W5HttpWatch StudioUsing HttpWatch StudioHttpWatch Studio is a standalone viewer for HttpWatch files. It can be started from the Windows Start menu under the HttpWatch program group or by double clicking on a .hwl file.The HttpWatch Studio window consists of four sections:MenuThe toolbar is displayed at the top of the window and contains buttons that are used to control HttpWatch Studio. For more information see Menus.ToolbarThe toolbar is displayed at the top of the window and contains buttons that are used to control HttpWatch Studio. For more information see Toolbar Buttons.Request GridThis displays a scrollable list of HTTP requests that have been recorded by HttpWatch. For more information see Requests Grid.Request ViewSelecting an item in the requests grid causes the lower part of the HttpWatch window to display detailed information about that item. The size of this region can be adjust by dragging the horizontal line that separates it from the requests grid. For more information see Request View.5.1 MenusFile menuEdit menuView menuTools menuWindow menuHelp menuFile menu commandsThe File menu offers the following commands:Edit menu commandsThe Edit menu offers the following commands:View menu commandsThe View menu offers the following commands:Group By Page Controls whether requests should be grouped by pageTools menu commandsThe Tools menu offers the following commands:Window menu commandsThe Window menu offers the following commands: Cascade Arranges windows in an overlapped fashion.Help menu commandsThe Window menu offers the following commands:5.2Toolbar Buttons∙Open∙Save∙Print∙Print Preview∙Summary∙Properties∙Filter∙LicenseOpenClicking this item opens an HttpWatch log file (.hwl) in HttpWatch Studio.Clicking this item saves the complete log to an HttpWatch log file (.hwl). The Open using HttpWatch Studio checkbox can be used to automatically load the log file into the HttpWatch Studio after it has been saved.The arrow on the toolbar next to this button provides access to Export to CSV... , Export to XML..., Export to HAR... and Send by Email...HttpWatch log files can be reopened using File->Open in HttpWatch Studio or by double clicking on a .hwl file.If you are using HttpWatch Professional Edition, the files you save can be viewed in HttpWatch Basic Edition and you can view the complete contents of files saved in HttpWatch Basic Edition. For more information about transferring log files please see Basic vs Professional Edition.PrintClicking this item opens the Print dialog.Pint PreviewClicking this item opens the Print Preview window.SummaryClicking this item shows or hides the Summary View.PropertiesClicking this item shows or hides the Properties Window.FindClicking this button will open the Find dialog a nd allow text to be quickly located anywhere in the log of requests.Clicking this button will open the Filter dialog and allow requests to be filtered by content type. LicenseClick this button to set or change the HttpWatch license key.6Using HttpWatchThis section describes how to use and configure HttpWatch:HttpWatch User InterfaceUsing the FilterConfiguring Content EditorsWorking with SAP URLsSilent Install of HttpWatch6.1User InterfaceThe HttpWatch user interface in HttpWatch Studio and the plug-in for Internet Explorer and Firefox have four main sections:1. ToolbarThe toolbar is displayed at the top of the window and contains buttons that are used to control HttpWatch. For more information see Toolbar Buttons.2. Request GridThis displays a scrollable list of HTTP requests that have been recorded by HttpWatch. For more information see Requests Grid.3. Request ViewSelecting an item in the requests grid causes the lower part of the HttpWatch window to display detailed information about that item. The size of this region can be adjust by dragging the horizontal line that separates it from the requests grid. For more information see Request View.4. Summary ViewClicking on the Summary toolbar button or selecting multiple items in the requests grid opens a window that displays summary data. For more information see Summary View.Request GridWhat is the Request Grid?The upper part of the HttpWatch window displays a scrollable list of captured HTTP/HTTPS requests and is automatically updated in the HttpWatch plug-in as you access a web site. Clicking on a column heading will cause the data to be sorted in ascending order based on data in that column. A second click on the same column will reverse the sort order and display the data in descending order.Details of the currently selected item are displayed in the request view. If you selected more than one request or a page heading then a summary of the recorded data is displayed in the Summary View.For more information on the way data is displayed please refer to these sections:Page GroupingPage Level Time ChartsData ColumnsThe columns used by the grid can be changed using the Select Columns dialog. These columns are displayed by default:StartedThe time at which the request was started by the browser. This is an offset in hours, minutes and seconds from the first entry in the log.TimeThe time in seconds to complete the request. This is measured from when the browser first started processing the request until the last byte of data is read from the response.Time ChartA graphical bar chart representation of each request relative to other requests in the same page. This column can be hidden using the 'Time Chart Column' option on the view menu. The timing bars and events lines shown in this column are described in Page Level Time Charts! (Warnings)HttpWatch detects possible problems in each recorded request. An exclamation mark is displayed in this column if one or more warnings were assigned to a request.SentThis is total number of bytes sent by the browser in the HTTP request message. It includes the size of the HTTP request headers and any POST data (e.g. form values or uploaded files).ReceivedThis is total number of bytes downloaded by the browser while reading the HTTP response and includes both the size of the HTTP headers and content. For commonly encountered result values you can interpret this value as follows:200For an HTTP OK response this value is the size of HTTP response headersThe HTTP method that was used when the request was sent.ResultIf the request was successful then the HTTP status code will be shown here, e.g. 200 for OK, 404 for page not found, 403 permission denied or 304 if a requested resource has not been modified. In cases where the content was read from the cache without contacting the HTTP server, this column contains '(Cache)'.The value 'Aborted' in this column indicates that the browser cancelled the HTTP operation before it completed. This can occur if images are being downloaded when you click on a link to a different page.TypeThis shows an icon representing the type of content that was downloaded. The tooltip for each entry displays the underlying mime type, e.g. 'text/html'.URLThe address of the web content being accessed, e.g. /default.asp. HttpWatch can reformat SAP portal URLs into an easier to read format. See for Working with SAP URLs more details.Page GroupingGrouping of Recorded RequestsThe Request Grid is grouped by page unless there is no page grouping information available or grouping as been disabled using the 'Group By Page' option on the view menu.Please refer to the sections below that describe the numbered items in this screen shot:1. Expanded Page GroupThis page group starts at 0:00.000 in the log file and contains 12 requests. The page header shows the title of the page and displays a '-' symbol that can be used to collapse the group. The summary line at the end of the group shows that the page took 3.671 seconds to download, The blue color of the page header indicates that this is a normal page load.The structure and color scheme used in the time chart for the page are described in Page Level Time Charts.2. Expanded Dynamic Page GroupThis page group starts at 0:23.649 in the log file and the yellow color of the page header indicates that this was a dynamic change to a previously loaded page. Dynamic page groups are usually the result of AJAX calls or modifications made by Javascript functions or event handlers.3. Collapsed Page GroupThis page group has been collapsed using the +/- control. The page header shows the page title, total time and the number of requests.4. Ungrouped RequestsSome requests do not directly relatePage Level Time ChartHttpWatch Time ChartsColored bars are displayed in the time chart column of the Request Grid to show the relative timing of requests making up a page and the different phases of an HTTP request, e.g. connect, send, etc. Vertical lines are also included to show where certain page level events occurred.The screen shot below shows a time chart from the Google Mail home page:Request TimingsThe colored horizontal bars are described below:ColorTiming NameDescriptionBlocked The Blocked time includes any pre-processing time (such as cache lookup) and the time spent waiting for a network connection to become available. IE 7 and Firefox 2 will only create a maximum of two concurrent network connections per host name (i.e.) and will queue up requests until a network connection is available. Often the Blocked time is the most significant factor in the download time of images embedded in a web page.DNS Lookup DNS Lookup is the time required to resolve a host name (e.g. ) into a numeric IP address (e.g. 216.239.59.99).Connect Connect is the time required to create a TCP connection to the web server (or proxy). If a secure HTTPS connection is being used this time includes the SSL handshake process. Keep-Alive connections are often used to avoid the overhead of repeatedly connecting to the web server.Send Send is the time required to send the HTTP request message to the server and will depend on the amount。