path: root/files/ja/tools/webide/setting_up_runtimes/index.html

---
title: ランタイムのセットアップ
slug: Tools/WebIDE/Setting_up_runtimes
translation_of: Archive/WebIDE/Setting_up_runtimes
---
<div>{{ToolsSidebar}}</div><p>ランタイムは Web ブラウザなど、アプリの実行やデバッグを行う環境です。以下のようなランタイムがあります:</p>

<ul>
 <li>Firefox のインスタンス。デスクトップ版あるいは携帯電話で実行する Android 版 Firefox のインスタンスです。</li>
 <li>Firefox OS を実行するデバイス、またはデスクトップ環境にインストールした Firefox OS シミュレータ。</li>
 <li>デスクトップまたはモバイルデバイスで実行する Google Chrome や Safari といった、別のブラウザエンジン。</li>
</ul>

<p>WebIDE では、右側のサイドバーでランタイムを管理します:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/12149/webide-right-sidebar.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;"></p>

<p>サイドバーでは、ランタイムを 4 種類にグループ分けしています:</p>

<dl>
 <dt><a href="/ja/docs/Tools/WebIDE/Setting_up_runtimes#Connecting_a_Firefox_OS_device">USB デバイス</a></dt>
 <dd>USB で接続した Firefox OS デバイス。Firefox 36 より、<a href="/ja/docs/Tools/Remote_Debugging/Debugging_Firefox_for_Android_with_WebIDE">USB 経由で Android 版 Firefox</a> への接続も可能です。</dd>
 <dt><a href="/ja/docs/Tools/WebIDE/Setting_up_runtimes#Connecting_over_WiFi">WI-FI デバイス</a></dt>
 <dd>Wi-Fi 経由で接続した Firefox OS デバイス。<em>Firefox 39 の新機能</em></dd>
 <dt><a href="/ja/docs/Tools/WebIDE/Setting_up_runtimes#Adding_a_Simulator">シミュレータ</a></dt>
 <dd>インストール済みの、Firefox OS シミュレータのインスタンス。</dd>
 <dt><a href="/ja/docs/Tools/WebIDE/Setting_up_runtimes#Other_runtimes">その他</a></dt>
 <dd>任意のホスト名とポートを使用して、リモートランタイムに WebIDE を接続します。<a href="/ja/docs/Tools/Valence">Valence</a> アドオンをインストールしている場合は、<a href="/ja/docs/Tools/WebIDE/Setting_up_runtimes#Valence-enabled_runtimes">アドオンで使用可能になるランタイム</a>をこのセクションに表示します。</dd>
</dl>

<p>ここでは、ランタイムを追加する方法を説明します。</p>

<h2 id="Connecting_a_Firefox_OS_device" name="Connecting_a_Firefox_OS_device">Firefox OS デバイスを接続する</h2>

<p>十分に新しいバージョンの Firefox と Firefox OS がある場合は、<a href="/ja/docs/Tools/WebIDE/Setting_up_runtimes#Connecting_over_WiFi">Wi-Fi 経由で Firefox OS デバイスに接続できます</a>。そうでない場合は、USB 経由で接続しなければなりません。</p>

<ul>
 <li id="Connecting_over_USB"><a href="/ja/docs/Tools/Remote_Debugging/Debugging_Firefox_OS_over_USB">USB 経由で接続する方法</a></li>
 <li><a href="/ja/docs/Tools/Remote_Debugging/Debugging_Firefox_OS_over_Wifi">Wi-Fi 経由で接続する方法</a></li>
</ul>

<h2 id="Connecting_to_Firefox_for_Android" name="Connecting_to_Firefox_for_Android">Android 版 Firefox に接続する</h2>

<p>USB で接続した Android デバイスおよび Android 版 Firefox を、"USB デバイス" 配下のランタイムとして表示します。また Firefox 42 より、Wi-Fi 経由でAndroid 版 Firefox に接続できます。</p>

<ul>
 <li id="Connecting_over_USB"><a href="/ja/docs/Tools/Remote_Debugging/Debugging_Firefox_for_Android_with_WebIDE">USB 経由で接続する方法</a></li>
 <li><a href="/ja/docs/Tools/Remote_Debugging/Debugging_Firefox_for_Android_over_Wifi">Wi-Fi 経由で接続する方法</a></li>
</ul>

<h2 id="Adding_a_Simulator" name="Adding_a_Simulator">シミュレータを追加する</h2>

<p><a href="/ja/docs/Tools/Firefox_OS_Simulator">Firefox OS シミュレータ</a>は Firefox OS の上位層であり、パソコン上で動作して Firefox OS デバイスのシミュレーションを行います。これは Firefox OS デバイスと同じサイズのウィンドウで動作し、Firefox OS のユーザインターフェイスや同梱アプリを含み、そして Firefox OS デバイスの API の多くをシミュレーションします。</p>

<p>これは多くの場合、アプリのテストやデバッグに実機が必要ないということです。</p>

<p>シミュレータは Firefox に同梱せず、<a href="/ja/docs/Mozilla/Add-ons">アドオン</a>として提供しています。ランタイムサイドバーで "シミュレータをインストール" をクリックすると、さまざまなバージョンの Firefox OS シミュレータをインストールできるページが開きます。</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/12151/webide-extra-components.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;">シミュレータはいくつでもインストールできます。シミュレータはダウンロードに時間がかかりますので、お待ちください。</p>

<div class="note">
<p>Firefox OS シミュレータ 2.6 以降を使用するには、Firefox 45 以降を使用しなければなりません。</p>
</div>

<p>シミュレータをインストールしたら "追加のコンポーネント" ウィンドウを閉じてください。ランタイムサイドバーの項目として、インストールしたシミュレータが表示されます:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/12153/webide-installed-simulators.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;"></p>

<p>シミュレータについて詳しくは、<a href="/ja/docs/Tools/Firefox_OS_Simulator">ドキュメント</a>をご覧ください。</p>

<h3 id="Configuring_Simulators" name="Configuring_Simulators">シミュレータの設定</h3>

<div class="note">
<p>Firefox 42 の新機能</p>
</div>

<p>Firefox 42 より、サイドバー上のシミュレータの項目の隣に設定アイコンがあります:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/11321/webide-settings.png" style="display: block; height: 50px; margin-left: auto; margin-right: auto; width: 364px;"></p>

<p>アイコンをクリックすると、シミュレータの設定を行う画面を表示します:</p>

<p><img alt="" src="https://mdn.mozillademos.org/files/12155/webide-simulator-options.png" style="display: block; height: 712px; margin-left: auto; margin-right: auto; width: 811px;">以下の設定が可能です:</p>

<ul>
 <li>名前</li>
 <li>カスタム<a href="/ja/Firefox_OS/Building_the_Firefox_OS_simulator">デスクトップ B2G ビルド</a>を使用する</li>
 <li>カスタム Gaia プロファイルを使用する</li>
 <li>シミュレータで特定のデバイスやスクリーンサイズをシミュレーションする</li>
</ul>

<h2 id="Other_runtimes" name="Other_runtimes">その他のランタイム</h2>

<h3 id="Remote_runtime" name="Remote_runtime">リモートランタイム</h3>

<p>リモートランタイムによって、任意のホスト名とポート番号を使用してリモートデバイスに接続できます。</p>

<p>内部で Firefox OS デバイスや Android デバイスは、Android Debug Bridge あるいは <a href="http://developer.android.com/tools/help/adb.html">ADB</a> と呼ばれるプログラムを用いてパソコンと接続しています。デフォルトで WebIDE は、ADB Helper を使用します。これは ADB のインストールやポートフォワーディングの設定により手続きを単純化しますので、Firefox のデスクトップツールとデバイスがメッセージを交換できるようになります。</p>

<p>これはほとんどの場合に便利ですが、ADB を WebIDE の外部で使用したい場合があるかもしれません。例えば、コマンドラインから直接 ADB を実行することがあるでしょう。その場合は <a href="http://developer.android.com/tools/help/adb.html#forwardports"><code>adb forward</code></a> コマンドを使用して、ホスト名とポート番号を指定することによりデバイスと接続します (例: <code>adb forward tcp:6000 localfilesystem:/data/local/debugger-socket</code>)。<br>
 さらに WebIDE も接続したい場合は <a href="https://support.mozilla.org/ja/kb/disable-or-remove-add-ons#w_how-to-disable-extensions-and-themes">ADB Helper アドオンを無効化</a>したうえでカスタムランタイムにより、<code>adb forward</code> に渡すホスト名とポート番号を入力 (例: <code>localhost:6000</code>) して WebIDE を接続します。</p>

<p>また Firefox 36 より前のバージョンでは、ADB Helper は Android 版 Firefox への接続をサポートしていないため、Android 版 Firefox に WebIDE を接続したい場合はポートフォワーディングを設定したうえで、カスタムランタイムを使用して接続することが必要です。詳しくは Firefox 36 より前のバージョンで <a href="/ja/docs/Tools/Remote_Debugging/Firefox_for_Android">ADB を使用して Android 版 Firefox に接続する方法</a>のドキュメントをご覧ください。</p>

<h3 id="Valence-enabled_runtimes" name="Valence-enabled_runtimes">Valence で使用できるランタイム</h3>

<p><a href="/ja/docs/Tools/Valence">Valence</a> アドオンをインストールしている場合は、以下 3 種類のランタイムが追加されます:</p>

<ul>
 <li>Android 版 Chrome</li>
 <li>iOS 版 Safari</li>
 <li>デスクトップ版 Chrome</li>
</ul>

<p>これらのランタイムに接続する手順は、<a href="/ja/docs/Tools/Remote_Debugging">リモートデバッグ</a>の該当するページで確認してください。</p>

<h2 id="Selecting_a_runtime" name="Selecting_a_runtime">ランタイムの選択</h2>

<p>ランタイムをセットアップすると、ランタイムサイドバーで選択できるようになります。</p>

<ul>
 <li>シミュレータを選択すると、WebIDE はシミュレータを起動します。</li>
 <li>Firefox OS デバイスを選択すると、WebIDE はデバイスに接続します。デバイスでは接続を望むかを問い合わせるダイアログが表示されます。"OK" を押してください。</li>
</ul>

<p>以上で、WebIDE のツールバーの中央にある "インストールして実行" ボタンが使用可能になります。このボタンをクリックして、選択したランタイムで<a href="/ja/docs/Tools/WebIDE/Running_and_debugging_apps">アプリのインストールや実行</a>を行います。</p>