VS2015によるリモートJavaScriptデバッグ。 パート1

「VS2015 Remote Debugging Javascript」という記事の翻訳を提案します。

VS2015は、JavaScriptコードの第一級のデバッグエクスペリエンスを提供します。 リモートデバッグ機能を使用して、リモートマシンでJavaScriptコードをデバッグできます。 デバッグされたプロセスは、IE、Windowsストアアプリケーション、または組み込みブラウザーのコントロールを使用する.NETアプリケーションでさえも可能です。 ローカルでデバッグできるほとんどすべてのものは、リモートデバッグにも使用できます。 これにより、たとえば、QAまたは実稼働環境で直接動作するJavaScriptコードをデバッグできるようになりました。 開始するには、次の手順を使用できます。

開発マシンにVisual Studio 2015をインストールします 。 ほとんどの開発者はこれを行う方法を認識しているため、これについては詳しく説明しません。

ターゲットマシンにVS 2015 Remote Debuggerをインストールします。

1. www.microsoft.com/en-us/download/details.aspx?id=48155&NavToggle=Trueにアクセスして、ターゲットシステムの容量に対応するバージョンをダウンロードします。 ARMプロセッサを搭載したWindowsにリモートデバッガをインストールすることもできます。
   
   
2. rttols_setup_x64.exeをダブルクリックして、インストーラーを起動します。
   
   
   
   
3. [インストール]をクリックすると、UAC（ユーザーアカウント制御）確認ウィンドウが表示されます。 リモートデバッグツールをインストールするには管理者権限が必要です。 [はい]をクリックしてインストールを続行します。
   
   
   
   
4. プログラムは必要なファイルをインストールします。
   
   
   
   
5. [閉じる]をクリックすると、インストールが完了します。
   
   
   
   
6. ターゲットマシンに正常にインストールされた後、新しいリモートデバッガーアプリケーションを検出できます。
   
   
   

ターゲットマシン上のVS 2015リモートデバッガー構成。

1. VS2015リモートデバッガー構成ウィザードをクリックします。 システムは、システム管理者の資格情報を入力するか、昇格された特権で実行するかどうかを尋ねます。その後、実際にはウィザードが開始されます。 [次へ]をクリックして続行します。
   
   
   
   
2. [Visual Studio 2015リモートデバッガーサービスを実行する]を選択し、[次へ]をクリックします。 LocalSystemアカウントのパスワードを入力する必要はありません。 また、サービスが機能するために、ターゲットマシンの管理者権限を持つ他の資格情報を入力することができます。
   
   
   
   
3. 次の画面で、マシンが企業ドメイン内にあり、イーサネットケーブルを介してマシンに直接接続している場合、3番目のオプションを選択解除することができます。 クリックして続行次へ：
   
   
   
   
4. [完了]をクリックして構成を完了します。
   
   
   
   
5. ここでタスクマネージャーを開き、リモートデバッガーが実行され、使用できる状態になっていることを確認します。 64ビットシステムでは、デバッガーの2つのインスタンス、32ビットと64ビットが表示されます。
   
   
   
   

VS2015をターゲットマシンのVS2015リモートデバッガーに接続します。

1. VS2015リモートデバッガーをインストールしたターゲットマシンでInternet Explorer を起動します。 その中に、msn.comなどのデバッグサイトを開きます。
   
   
2. 開発者のマシンで、VS2015を開きます。 [ デバッグ]-> [ プロセスにアタッチ]をクリックします。
   
   
   
   
3. [ プロセスにアタッチ]ウィンドウで、[ 修飾子]フィールドにターゲットマシンを指定します。 または、[ 検索 ]ボタンをクリックして、ドメイン内のマシンを検索します。 この例では、ターゲットマシンの名前はContosoDev2です。
   
   
   
   
4. デフォルトでは、リストは更新されないため、「 更新」ボタンをクリックして、実行中のプロセスのリストを表示します。 別のユーザーが開始したプロセスをデバッグする場合は、[ すべてのユーザーからプロセスを表示 ]オプションを選択することもできます。 ターゲットプロセスiexplore.exeを選択し、[ アタッチ ]ボタンをクリックします。
   
   
   
   
   
   注：
   
   
   • LocalSystemアカウントで実行するようにリモートデバッガが構成されている場合、 プロセスを表示するには、[ すべてのユーザーからプロセスを表示 ]オプションを選択する必要があります。 それ以外の場合は、 SYSTEMアカウントプロセスのみがリストされます。
   • 修飾子（ 修飾子フィールド）は、 ContosoDev2からContosoDev2に変更される場合があります：4020
   • （スクリーンショットのように）[ 添付]フィールドでスクリプトコードが選択されていることを確認します。
   
   
5. Visual Studioは、リモートプロセスへの接続時に潜在的なセキュリティの問題を警告します。 リモートプロセスとその中で開いているサイトがわかっている場合は、[接続]をクリックして続行します。
   
   
   
   
6. 接続に成功すると、ソリューションエクスプローラーウィンドウにJavaScriptファイルが表示されます。 DOM Explorerは、実行中のサイトの構造も表示します。
   
   
   
   
   
   
7. そして今、私たちは今、奇跡のサイトをデバッグして、いつものようにリモートマシンで開くことができます：
   
   
   
   

Webブラウザーコントロール（WebOC）でのJSコードのデバッグ。 IEだけでなく、WebOCまたはWeb Browser Controlのホストであるアプリケーション（.NET / C ++ |管理対象/ネイティブ）もデバッグできます。 これを行うには、ターゲットマシンでアプリケーションを実行するだけです。 この例では、WebOCを使用した.NETアプリケーションの名前はPCOETest.exeになります。 VS2015を開き、既に説明したリモートプロセスへの接続プロセスに従って、IEの代わりにアプリケーションに接続します。



Webブラウザーコントロールのホストとして機能するローカル管理アプリケーションであるかのようにデバッグできます。





デバッグと問題の修正に関するよくある質問（FAQ）。

1. コンピューターが見つかりません 。 ファイアウォールが接続をブロックしていないことを確認してください。 TCPViewなどのユーティリティを使用して、ポートが開いているかどうかを確認できます。 追加情報については、 ファイアウォール構成セクションまたはターゲットマシン上のリモートデバッガーのヘルプファイルを参照することもできます。
   
   舞台裏では、VS 2015リモートデバッガーのインストールプロセスにより、ファイアウォールルールがリモートデバッグを許可するように構成されます。 リモートデバッガはデフォルトでTCPポート4020を使用しますが、必要に応じて別のポートを使用できます。 ポート4020（または選択したポート）のmsvsmon.exeがファイアウォールまたはその他のセキュリティソフトウェアであることを確認してください。 64ビットOS上のx86プロセスの場合、ポート4021が開いていることも確認してください。
   
   
2. IEプロセスをデバッグすると、VS2015の[スレッド]ウィンドウにスレッドが表示されません。 または、IE /ターゲットプロセスをデバッグできません。
   
   正しいIEインスタンスに接続していることを確認してください。 IEは、初期ブート時に2つのプロセス（フレームプロセスとタブプロセス）を開始します。 フレームではなく、タブプロセスにデバッガを接続する必要があります。 追加情報： LCIE
   
   
3. IEタブプロセス（IEタブプロセス）に接続すると、VS2015の[スレッド]ウィンドウにスレッドが表示されません。
   
   Visual Studio JavaScriptコンソールウィンドウをご覧ください。 このようなエラーが表示されますか？
   
   
   
   その場合は、ターゲットマシンでIEを構成して、スクリプトのデバッグを有効にする必要があります。 だから：
   
   
   • ターゲットマシンでInternet Explorerプロセスを開きます
   • [ ツール]-> [インターネットオプション ]をクリックし、[ 詳細設定 ]タブを選択します
   • [詳細設定]タブで、次の2つの項目の選択を解除します。
     
     
     
     
   • [OK]または[適用]をクリックして、変更を適用します。
   • デバッガーを無効にし、\デバッグを停止し、デバッガーを再接続してください
   
   
   
4. 目的のIEプロセスに接続するとき、スレッドが表示されません（これら2つのオプションを削除した後でも）。
   IEプロセスを再起動するか、新しいプロセスを開始してください。 VSデバッガーをこの新しいプロセスに接続します。
   
   
5. リモートデバッガーの複数のインスタンスを実行できますか？ ユーザーごとに1つ言いますか？
   リモートデバッガーの多くのインスタンスは、同じコンピューターで実行できます。 これは、多くのユーザーが共有する1つのサーバーがあり、各ユーザーが独自のプロセスをデバッグするために独自のリモートデバッガーインスタンスを持つ場合に必要です。
   
   各インスタンスは、独自のTCP \ IPポートで実行する必要があります。 これは、リモートデバッガーの[ツール]-> [オプション]メニューまたはコマンドラインスイッチを使用して設定できます。
   
   /ポート：<値>
   
   リモートデバッガーの特定のインスタンスに接続するには、プロセス接続ウィンドウでコンピューター名とポートのコロン番号を指定するだけです（たとえば、MyServer：1234）。
   
   
6. IISで実行されているWebサービスなどのリモートサービスをデバッグできますか？
   
   はい リモートデバッガーは、WindowsサービスまたはWindowsアプリケーションとして実行できます。 サービスとして実行すると、リモートマシンにログオンしなくても、ASP.NETなどのサーバーアプリケーションを簡単にデバッグできます。
   
   デバッガをサービスとして実行すると、常に開始され、ネットワーク上でリッスンされます。 サービスとして実行されているリモートデバッガを使用してクライアントアプリケーションをデバッグすることはお勧めしません。
   
   Visual Studio 2015リモートデバッグ構成ウィザードを使用して、リモートデバッガーを実行しているアカウントのユーザー名とパスワードを制御できます。 リモートデバッガーをサービスとして実行している場合、リモートでコードをデバッグできるようにするには、次の要件を満たす必要があります。
   
   
   • プロセスをデバッグできるようにするには、ユーザーはComputer Administratorsグループのメンバーである必要があります。
   • ユーザーに「サービスとしてログオン」する権利を付与する必要があります。これは、管理ユーティリティ「ローカルセキュリティポリシー」を使用して実行できます。
   
   デフォルトのユーザーは「LocalSystem」です。
   
   サービス名：「Visual Studio 2015 Remote Debugger」。 Visual Studio 2015リモートデバッガー構成ウィザードを使用してのみサービスを管理することをお勧めします。 必要に応じて、管理ユーティリティを使用してコンピューターまたはコマンドラインを制御することもできます。「net stop msvsmon140」または「net start msvsmon140」。
7. .NETやT-SQLなどのJS以外のコードをデバッグできますか？
   
   はい、VS 2015がデバッグをサポートするコードをデバッグできます：マネージコード、アンマネージ、GPU、PowerShell、スクリプト、T-SQL、ワークフロー...
   
   
   
   
8. ターゲットマシンに何かをインストールする必要がありますか？
9. VS2015 Remote Debuggerをインストールするには何が必要ですか？
10. VS2015 Remote Debuggerは内部的に何を使用しますか？
    
    リモートデバッグは、Windows WebサービスAPIを使用して実装されます。 Windows WebサービスAPIは、リモートデバッガなどのアプリケーションがネットワークを介して相互に通信できるビルディングブロックです。 このAPIは、Windows 7、Windows Server 2008 R2以降に既に含まれています。 Windows Server 2008（R2より前）では、Visual Studio Remote Toolsインストーラーが自動的にAPIをインストールします。
    
    
11. コマンドラインを使用してリモートデバッガーを起動または停止できますか？
    はい、詳細については参考資料を参照してください
    
    
12. デバッグ中にプロセスを開始できますか？
    
    リモートデバッガーに接続するようにVisual Studioを構成します。
    
    
    • C＃/ VBプロジェクトを開始する場合：プロジェクトプロパティを開き、[デバッグ]タブに移動して、リモートマシンを使用するオプションをオンにします
    • C ++プロジェクトを開始する場合：プロジェクトのプロパティを開き、デバッグオプションで、起動値をリモートWindowsデバッガに変更し、リモートコマンドプロパティでリモートコンピュータが使用するパスを設定します
    • 既に実行中のプロセスに接続するには：[プロセスにアタッチ]ダイアログ（[ツール]または[デバッグ]メニュー項目から）を使用して、[修飾子]フィールドにリモートコンピューターの名前を入力し、目的のプロセスを選択します。
    • Webサイトをデバッグするには：リモートコンピューター（ファイル共有）からWebサイトを開き、カスタムWebサーバープロパティをWebサーバーのURLに構成します（例：http：// myserver ）
    • プロジェクトなしで実行可能ファイルを実行するには：実行可能ファイルをプロジェクトとして開き（ファイル->プロジェクトを開く）、デバッグプロジェクトを作成し、実行可能ファイルへのパスを入力します（例：\\ MyTestComputer \ c $ \ MyTest.exe）。 次に、プロジェクトのプロパティを開き、接続値を変更します。 また、Executableプロパティをリモートマシンが使用するパスに微調整します。
    
    

ファイアウォールのセットアップ：

• VS2015デバッガーとターゲットマシン間の相互作用は常に認証され、後続の呼び出しは常に暗号化されます。
• リモートデバッグを有効にするには、Visual Studioコンピューターとリモートデバッガー間のファイアウォールを構成して、リモートデバッガー（msvsmon.exe）がVisual Studioから送信されたデータを受信できるようにする必要があります。
• ほとんどの場合、リモートデバッガーはファイアウォールを自動的に構成します
  
  • それでも、そうでない場合は、ポート4020（x64 OSの64ビットプロセスおよびx86 OSの32ビットプロセス）およびポート4021（x64 OSの32ビットプロセス）を開きます。
  • [リモートデバッガーの構成]ダイアログを使用して、Windowsファイアウォールルールをすべてのネットワークプロファイル（ドメイン、プライベート、および非公式/パブリック）に適用できます。 Ethernetケーブルを使用してVSデバッガーをターゲットデバイスに直接接続する場合は、Informal / Publicを使用します