このガイドでは、同じマシン上の別のインスタンスとして実行しているデスクトップ版 Firefox に、Firefox 開発ツールを接続する方法を説明します。ここでは、デバッグされる Firefox のインスタンスをデバッギ、デバッグを行う Firefox のインスタンスをデバッガと呼びます。
リモートデバッグを有効化する
始めにデバッガとデバッギの開発ツールのオプションで、"ブラウザとアドオンのデバッガを有効" および "リモートデバッガを有効" を有効にしなければなりません。Firefox Developer Edition を使用している場合は、デフォルトで有効化されています。
この作業は 1 回だけ必要です。設定値は再起動後も維持されます。
デバッガサーバを開始する
次に、デバッギでデバッガサーバを開始します。
Firefox 37 より前のバージョン
Firefox 37 より前のバージョンでは、開発ツールバーを開いて以下のコマンドを実行します:
listen 6000
このコマンドは、ポート 6000 番でデバッガクライアントの接続を待ち受けするよう、デバッギに指示します。6000 番以外も使用できます。
デバッギを再起動した場合は、再度コマンドを実行しなければなりません。
Firefox 37 以降のバージョン
Firefox 37 以降でも前出の方法を使用できますが、もうひとつ方法があります。--start-debugger-server
オプションを渡して、コマンドラインからデバッギを起動します:
/path/to/firefox --start-debugger-server
引数を渡さない場合、--start-debugger-server はデバッガサーバをポート 6000 番で待ち受けさせます。別のポートを使用する場合は、希望するポート番号を渡します:
/path/to/firefox --start-debugger-server 1234
注記: Windows では、start-debugger-server
をハイフン 1 個で呼び出します:
firefox.exe -start-debugger-server 1234
注記: デフォルトではセキュリティ上の理由で、devtools.debugger.force-local
を設定してます。外部のマシンから Firefox インスタンスのデバッグを行いたい場合はこの設定を変更してもかまいませんが、信頼済みのネットワークまたはどのマシンがアクセスできるかを厳しく制御するファイアウォール規則が設定された環境でのみ行ってください。
接続
接続方法は 2 種類あります。接続画面を使用する方法と、WebIDE を使用する方法です。
接続画面
デバッガ側のツール/Web 開発メニュー配下に、"接続..." という項目があります。この項目をクリックすると、以下のようなページが開きます:
デバッギに待ち受けさせているポート番号を入力して、"接続" をクリックします。すると、デバッギが接続確認を求めるダイアログが表示されるでしょう:
"OK" をクリックしてデバッガ側に戻ると、以下のようなページが表示されます:
- "利用可能なリモートのタブ" に、デバッギで開いているすべてのタブを表示します。タブ名をクリックすると、そのタブに開発ツールを接続します。
- "利用可能なリモートのアドオン" に、デバッギにインストールしているすべてのアドオンを表示します。アドオン名をクリックすると、そのアドオンに開発ツールを接続します。
- "利用可能なリモートのプロセス" に、Firefox のプロセスを表示します。"メインプロセス" をクリックすると、ブラウザ自身に開発ツールを接続します。
WebIDE
デバッガ側で WebIDE を開くと、"ランタイムを選択" の中に "リモートランタイム" があります:
リモートランタイムを選択すると、ホスト名とポート番号を求められます。"localhost:6000"、またはデバッギで別のポート番号で待ち受けさせている場合はポート番号を指定します。
すると、警告ダイアログを表示します:
OK をクリックします。WebIDE が、メインプロセスに開発ツールを接続します。content タブに接続したい場合は、左側のメニューを開いてデバッグを行いたいタブを選択してください。