Net Panel Remoting

From FirebugWiki

(Difference between revisions)
Jump to: navigation, search
m
(Remote HTTP Protocol (RHP) Requirements)
 
(One intermediate revision not shown)
Line 4: Line 4:
* [http://getfirebug.com/wiki/index.php/Net_Panel_Architecture_Review Net Panel Architecture Review]
* [http://getfirebug.com/wiki/index.php/Net_Panel_Architecture_Review Net Panel Architecture Review]
* [https://wiki.mozilla.org/Remote_Debugging_Protocol Remote Debugging Protocol] (part of JSD2 effort)
* [https://wiki.mozilla.org/Remote_Debugging_Protocol Remote Debugging Protocol] (part of JSD2 effort)
-
* [http://hg.mozilla.org/users/dcamp_campd.org/remote-debug/ Firefox Source] (includes support for remote debugging protocol)
+
* [http://getfirebug.com/wiki/index.php/HTTP_Monitor HTTP Monitor]
-
== Prototype ==
+
== HTTP Monitor ==
-
The working prototype shows the [[Net Panel]] connected to a remote Firefox instance. The user can select an existing tab opened on the remote browser and monitor HTTP traffic.
+
Check out [[HTTP Monitor]] to connect a remote Firefox/Fennec instances. The user can select an existing tab opened on the remote browser and monitor its HTTP traffic.
-
 
+
-
=== Installation ===
+
-
 
+
-
* Build Firefox from [http://hg.mozilla.org/users/dcamp_campd.org/remote-debug/ this repository]. It contains basic support for the client/server communication. It's made over TCP/IP and uses the [https://wiki.mozilla.org/Remote_Debugging_Protocol Remote Debugging Protocol]. The resulting Firefox build must be used for both, client and server instances.
+
-
 
+
-
* Create a new Firefox profile that represents the server side. You need to install the '''RemoteActor''' extension into the profile. This extension implements the Firebug back-end for the ''Net'' panel (HTTP observer). See the [http://code.google.com/p/fbug/source/browse/#svn%2Fextensions%2Fremoteactor source]
+
-
 
+
-
* You can also install the [[FBTrace|Firebug Tracing Console]] to see what's happening on the server. This is recommended. [http://getfirebug.com/releases/fbtrace/ Download the latest version].
+
-
 
+
-
* Create another Firefox profile, that represents the client side. You need to install the following extensions:
+
-
** Firebug 1.10: [http://code.google.com/p/fbug/source/browse/branches/firebug1.10 Download the source].
+
-
** RemoteBug: Firebug extension that represents the client side, [http://code.google.com/p/fbug/source/browse/#svn%2Fextensions%2Fremotebug download the source].
+
-
 
+
-
See how to install extensions [[Firebug Internals#Development Setup|from source]].
+
-
 
+
-
* You should also install FBTrace on the client side. Use the same XPI as for the server.
+
-
 
+
-
* The client side needs to specify the server name/port info. It's stored in preferences, see the default values:
+
-
 
+
-
<source lang="javascript">
+
-
pref("extensions.firebug.remotebug.serverHost", "localhost");
+
-
pref("extensions.firebug.remotebug.serverPort", 2929);
+
-
</source>
+
-
 
+
-
* Run both, the server and client Firefox instances. Here is an example of arguments for your command line:
+
-
 
+
-
<source lang="bash">
+
-
firefox -P server -no-remote -console
+
-
firefox -P client -no-remote -console
+
-
</source>
+
-
 
+
-
''Even when there is the FBTrace console the system console is still useful, too.''
+
-
 
+
-
=== UI ===
+
-
The prototype is in very early stage so, the existing UI is created just for testing. The final UI will be different.
+
-
 
+
-
Here is how to test the prototype:
+
-
 
+
-
* SERVER: Open some tabs
+
-
* CLIENT: Open Firebug UI (<code class="key">F12</code>). Firebug has a new button in the toolbar. It says ''Connect Me!'', if the client is not connected, otherwise ''Select Remote URL'' to pick one of the tabs opened on the server. Note that the client is trying to connect automatically at the beginning using the connection info (address, port) from the preferences. So connect, if necessary and select a tab from the menu.
+
-
* CLIENT Select the ''Net'' panel and enable it. You can press the ''Clear'' button, if the ''Net'' panel was enabled and there is some local HTTP traffic displayed.
+
-
* SERVER: Refresh the tab selected by the client.
+
-
* CLIENT: You should see entries (HTTP requests) appearing in the ''Net'' panel.
+
=== FBTrace ===
=== FBTrace ===
-
In order to see/filter logs on the server and client you should use following options in the FBTrace console.
+
In order to see/filter logs on the server and client you should use following options in the [[FBTrace]] console.
* Server: ''ERRORS'', ''ACTIVITYOBSEVER'', ''NETACTOR'', ''NET_EVENTS''
* Server: ''ERRORS'', ''ACTIVITYOBSEVER'', ''NETACTOR'', ''NET_EVENTS''
Line 102: Line 59:
* Some packets can use an additional ''error'' field in case of unexpected errors. The exact structure of the field should be provided.
* Some packets can use an additional ''error'' field in case of unexpected errors. The exact structure of the field should be provided.
-
== Remote HTTP Protocol (RHP) Requirements ==
+
== HTTP Monitor Remote Protocol Requirements ==
-
This section summarizes requirements for the RHP protocol.
+
This section summarizes requirements for remote protocol.
# There should be a way to get the list of opened tabs on the server
# There should be a way to get the list of opened tabs on the server

Latest revision as of 09:41, 29 April 2012

This page is summarizing support for remote HTTP monitoring in Firebug.

Contents

[edit] Resources

[edit] HTTP Monitor

Check out HTTP Monitor to connect a remote Firefox/Fennec instances. The user can select an existing tab opened on the remote browser and monitor its HTTP traffic.

[edit] FBTrace

In order to see/filter logs on the server and client you should use following options in the FBTrace console.

  • Server: ERRORS, ACTIVITYOBSEVER, NETACTOR, NET_EVENTS
  • Client: ERRORS, ACTIVITYOBSEVER, REMOTEBUG, REMOTENETMONITOR

[edit] Remote Protocol

The remote HTTP monitor uses and extends the Remote Debugging Protocol designed for Firefox.

Here is an example of a typical communication between the server and the client (described from the client perspective).

// Introduction packet, received just after connect to the server
RECEIVED {"from":"root","applicationType":"browser","traits":[]}
 
// Request list of opened tabs on the server
SENT: {"to":"root","type":"listTabs"}
 
// The client has a list of tabs
RECEIVED: {"from":"root","selected":0,"tabs":
    [{"actor":"conn2.tab2","title":"Google","url":"http://www.google.com/"}]}
 
// Attach to a tab.
SENT: {"to":"conn2.tab2","type":"attach"}
 
// Confirmation, client is now attached to the tab
RECEIVED: {"type":"tabAttached","threadActor":"conn2.context3","from":"conn2.tab2"}
 
// Request network-monitor actor
SENT: {"to":"conn2.tab2","type":"networkMonitorActor"}
 
// Network-monitor actor (ID) retrieved
RECEIVED: {"actor":"conn2.networkMonitor4","from":"conn2.tab2"}
 
// Subscribe to the network-monitor
SENT: {"to":"conn2.networkMonitor4","type":"attach"}
 
// Confirmation, the client is now subscribed for network events
RECEIVED: {"from":"conn2.networkMonitor4"}
 
// Selected tab has been navigated to new URL (or refreshed)
RECEIVED {"from":"conn2.tab2","type":"tabNavigated","url":"http://www.google.com/"}
 
// Selected tab executed HTTP request(s)
RECEIVED: {"type":"notify","from":"conn2.networkMonitor4","serial":1,"files":[<list-of-requests>]}
  • <list-of-requests>: Represents a list of executed requests in HAR format.
  • Some packets can use an additional error field in case of unexpected errors. The exact structure of the field should be provided.

[edit] HTTP Monitor Remote Protocol Requirements

This section summarizes requirements for remote protocol.

  1. There should be a way to get the list of opened tabs on the server
  2. It should be able to subscribe/unsubscribe to/from a tab
  3. The client should be able to be notified when the tab is navigated to a new URL or refreshed
  4. Collected HTTP data should be sent in chunks (e.g. every 300 ms, the timeout should be customizable)
  5. It should be possible to specify what data should be sent to the client by default
  6. There should be a way how to request data from the server on demand (e.g. response bodies)
  7. It should be also possible to specify what data should be actually cached on the server (i.e. what is monitored)
  8. The server should cache all data until:
    • (a) it is sent to the client (do we need support for more subscribed clients at the same time?)
    • (b) the tab is refreshed or navigated away (what about persistence across reloads?)

[edit] Open Question

  • In case the networkMonitorActor is the only network-related actor, it can be renamed to networkActor.
Personal tools