Packet Capture and Analyze

In this tutorial I will demonstrate how to capture packets using Wireshark and export captures in a web compatible format to view outputs in a user friendly environment.

Exporting Data

Wireshark provides a variety of options for exporting packet data. This section describes general ways to export data from the main Wireshark application. We will only use XML format and a script(in XSLT) to customize outputs. After you have loaded a capture file into Wireshark, choose File → Export Packet Dissections → as XML PDML and save the new file.

How to convert PDML to HTML

You can convert such a PDML file into HTML to view in a web browser. This is done with a XSLT (EXtensible Stylesheet Language) file called pdml2html.xsl.
You can download the file from the below link.

pdml2html.xsl0.06 MB

If you want to use the PDML file on a web server, all that is required is to place the pdml2html.xsl file in the same directory where the PDML file is located. The PDML file specifies the XSL file as a XML stylesheet and the web browser will automatically load the XSL file, apply the transformations to the PDML file and display the resulting HTML.

Sample Packet Capture

Using the above XSL script the final output will look like this.

Wireshark Caprureopen in new tab  
Drag the arrow(⇲) button on the bottom righ corner of the box to resize the wirshark window as well as the container.

Steps to view the files in Local PC

First you have to place the XSL file in the same folder where the XML files are. The browsers will not show the files by default due to cross origin policy.
Firefox will log the console error Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///C:/Users/anjachan/Documents/NetworkLab/pdml2html.xsl. (Reason: CORS request not http).
Google Chrome will log the console error as Unsafe attempt to load URL file:///C:/Users/anjachan/Documents/NetworkLab/pdml2html.xsl from frame with URL file:///C:/Users/anjachan/Documents/NetworkLab/mpls.xml. 'file:' URLs are treated as unique security origins.
You have to manually enable the feature by running the below command in the command prompt of the windows PC. The specific flag is --allow-file-access-from-files

On OS X: from run /Applications/Google\\ Chrome --allow-file-access-from-files

On Windows: from the command prompt run %LOCALAPPDATA%\Google\Chrome\Application\chrome.exe --allow-file-access-from-files

Close the chrome window and run the below command in the command prompt.
C:>cd Program Files (x86)\Google\Chrome\Application\
C:\Program Files (x86)\Google\Chrome\Application>chrome.exe --allow-file-access-from-files
C:\Program Files (x86)\Google\Chrome\Application>

Once done, open the locally saved XML into the Chrome. It will show the below results.

In Firefox you have to manually disable same origin policy. about:config -> security.fileuri.strict_origin_policy -> false
Refer the below link for more details.
Fix Cross Error in Firefox


Leave a Reply