mozilla

Revision 621743 of Metro 设备上远程调试Firefox

  • Revision slug: Tools/Remote_Debugging/Firefox_for_Metro
  • Revision title: Metro 设备上远程调试Firefox
  • Revision id: 621743
  • Created:
  • Creator: molang
  • Is current revision?
  • Comment

Revision Content

这篇文章解释了如何在在桌面版的火狐通过开发者工具使用远程调试( remote debugging) 来检查和编程Windows 8 (Merto 风格)的火狐app.

先决条件

你将要用到:

  • 运行在 触屏友好的“Metro” 风格的 Windows 8 电脑上面的的 Window 8(Metro 模式)的火狐(Windows 8 (Metro-style) Firefox)" .
  • 运行于传统“桌面”模式的Windows,Mac OS X,或者Linux ,或者一个独立的电脑或者独立配置文件

Set up Firefox for Metro

Go to about:config in Firefox for Metro, and set the following required preference:

  • devtools.debugger.remote-enabled = true

You may also want to set these optional preferences:

  • devtools.debugger.force-local = false (if you want to connect from a different machine over the network)
  • devtools.debugger.remote-host (to change the TCP hostname where Firefox will listen for connections)
  • devtools.debugger.remote-port (to change the TCP port number where Firefox will listen for connections)
  • devtools.debugger.prompt-connection = false (Allow connections without displaying a confirmation prompt.  This can be a security risk, especially if you also set the force-local preference to false.)

Set up Firefox for desktop

On the desktop, remote debugging is enabled by a setting in the Toolbox. Open the Toolbox, click the "Settings" button in the toolbar, and check "Enable remote debugging" in the Settings tab. If you're using a version of Firefox older than 27, you'll need to restart the browser for the setting to take effect.

Connecting

On the desktop

On the desktop, open the Web Developer menu and select "Connect...". You'll see a page that looks like this:

If you are running Firefox for Metro on the same computer with the default settings, use the default host (localhost) and port (6000), and press the "Connect" button.

If you are connecting to Firefox for Metro on a different computer or a different port, enter the appropriate hostname and port number and then press "Connect."

In the Windows 8 (Metro) browser

Next you'll see a dialog in Firefox for Metro asking you to confirm the connection.  Press the "OK" button to continue.

Tip: If the remote connection times out, flip to the desktop via the desktop tile and check if Windows Firewall has thrown up an incoming connection permissions prompt.

On the desktop

Next, the desktop shows you a dialog that looks something like this:

This is asking whether you want to debug web content running in a browser tab, or to debug the browser code itself.

  • You'll see one entry under "Available remote tabs" for each open tab, and clicking it will attach the debugging tools to the web content hosted by that tab. If you want to debug your web content, you'll choose the relevant content tab.
  • You'll see one entry under "Available remote processes": this is the browser process itself. You'll choose this option if you want to debug the browser's own code.

Let's choose to attach to the mozilla.org website. The Toolbox will open in its own window, attached to the Firefox for Metro tab that's currently hosting mozilla.org:

The Toolbox, and the tools it hosts (including the Console, Debugger, Style Editor, Profiler, etc.), work in just the same way as they do when attached to local content.

Revision Source

<p>这篇文章解释了如何在在桌面版的火狐通过开发者工具使用远程调试(&nbsp;<a href="/en-US/docs/Tools/Remote_Debugging">remote debugging</a>)&nbsp;来检查和编程Windows 8 (Merto 风格)的火狐app.</p>
<h2 id="Prerequisites">先决条件</h2>
<p>你将要用到:</p>
<ul>
 <li>运行在 触屏友好的“Metro” 风格的 Windows 8 电脑上面的的 Window 8(Metro 模式)的火狐(<a href="https://support.mozilla.org/en-US/kb/how-do-i-install-windows-8-metro-style-firefox">Windows 8 (Metro-style) Firefox)</a>" .</li>
 <li>运行于传统“桌面”模式的Windows,Mac OS X,或者Linux ,或者一个独立的电脑或者独立配置文件</li>
</ul>
<h2 id="Set_up_Firefox_for_Metro">Set up Firefox for Metro</h2>
<p>Go to <code>about:config</code> in Firefox for Metro, and set the following <strong>required </strong>preference:</p>
<ul>
 <li><code>devtools.debugger.remote-enabled = true</code></li>
</ul>
<p>You may also want to set these <strong>optional </strong>preferences:</p>
<ul>
 <li><code>devtools.debugger.force-local = false </code>(if you want to connect from a different machine over the network)</li>
 <li><code>devtools.debugger.remote-host </code>(to change the TCP hostname where Firefox will listen for connections)</li>
 <li><code>devtools.debugger.remote-port </code>(to change the TCP port number where Firefox will listen for connections)</li>
 <li><code>devtools.debugger.prompt-connection = false </code>(Allow connections without displaying a confirmation prompt.&nbsp; This can be a security risk, especially if you also set the <code>force-local</code> preference to <code>false</code>.)</li>
</ul>
<h2 id="Set_up_Firefox_for_desktop">Set up Firefox for desktop</h2>
<p>On the desktop, remote debugging is enabled by a setting in the Toolbox. <a href="/en-US/docs/Tools_Toolbox" title="/en-US/docs/Tools_Toolbox">Open the Toolbox</a>, click the "Settings" button in the <a href="/en-US/docs/Tools_Toolbox#Toolbar" title="/en-US/docs/Tools_Toolbox#Toolbar">toolbar</a>, and check "Enable remote debugging" in the <a href="/en-US/docs/Tools_Toolbox#Settings" title="/en-US/docs/Tools_Toolbox#Settings">Settings </a>tab. If you're using a version of Firefox older than 27, you'll need to restart the browser for the setting to take effect.</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5827/remote-debugger-toolbox-settings.png" /></p>
<h2 id="Connecting">Connecting</h2>
<h3 id="On_the_desktop">On the desktop</h3>
<p>On the desktop, open the Web Developer menu and select "Connect...". You'll see a page that looks like this:</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5813/remote-debugging-desktop-connect.png" /></p>
<p>If you are running Firefox for Metro on the same computer with the default settings, use the default host (localhost) and port (6000), and press the "Connect" button.</p>
<p>If you are connecting to Firefox for Metro on a different computer or a different port, enter the appropriate hostname and port number and then press "Connect."</p>
<h3 id="In_the_Windows_8_(Metro)_browser">In the Windows 8 (Metro) browser</h3>
<p>Next you'll see a dialog in Firefox for Metro asking you to confirm the connection.&nbsp; Press the "OK" button to continue.</p>
<p>Tip: If the remote connection times out, flip to the desktop via the desktop tile and check if Windows Firewall has thrown up an incoming connection permissions prompt.</p>
<h3 id="On_the_desktop">On the desktop</h3>
<p>Next, the desktop shows you a dialog that looks something like this:</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5819/remote-debugging-desktop-select-target.png" /></p>
<p>This is asking whether you want to debug web content running in a browser tab, or to debug the browser code itself.</p>
<ul>
 <li>You'll see one entry under "Available remote tabs" for each open tab, and clicking it will attach the debugging tools to the web content hosted by that tab. If you want to debug your web content, you'll choose the relevant content tab.</li>
 <li>You'll see one entry under "Available remote processes": this is the browser process itself. You'll choose this option if you want to debug the browser's own code.</li>
</ul>
<p>Let's choose to attach to the mozilla.org website. The Toolbox will open in its own window, attached to the Firefox for Metro tab that's currently hosting mozilla.org:</p>
<p><img alt="" src="https://mdn.mozillademos.org/files/5821/remote-debugging-console.png" style="display: block; margin-left: auto; margin-right: auto;" /></p>
<p>The Toolbox, and the tools it hosts (including the Console, Debugger, Style Editor, Profiler, etc.), work in just the same way as they do when attached to local content.</p>
Revert to this revision