BT

InfoQ ホームページ ニュース Visual Studio CodeでiOS Webアプリのデバッグが可能に

Visual Studio CodeでiOS Webアプリのデバッグが可能に

ブックマーク

原文(投稿日:2016/08/31)へのリンク

Visual Studio Codeの新たな拡張機能は 開発者が直接MacとWindows上のエディタからiOSデバイス上で実行されているJavaScriptのウェブアプリやサイトをデバッグすることを可能にすることを目指している、とMicrosoftのJavaScript DiagnosticsプログラムマネージャーであるKenneth Auchenberg氏記している

iOSのウェブアプリのデバッグにはMacへアクセスしSafari Web Inspectorを実行する、または、BrowserStackのようなクロスブラウザ互換性チェッカーを使う必要があったとAuchenberg氏は説明する。Visual Studio Codeの新しい拡張機能「Debugger for iOS Web」はMicrosoftがVisual Studico Code Chrome Debuggerのために開発したオープンソースのライブラリであるvscode-chrome-debug-coreを活用しており、他にもios-webkit-debug-proxyios-webkit-debug-proxy-win32という2つのライブラリを使用してiOSデバイスへのUSB接続を介したコミュニケーションを実現している。iOSデバイスとのコミュニケーションはスクリプトデバッギングAPIのChrome Debugger Protocolと互換性があるWebKit Remote Debugging Protocolに準拠しており、これはMicrosoftのChromeへのデバッグはほぼ変更がなくても動作することを意味する。

Visual Studio Codeの拡張機能はプロジェクトのルートにある.vscode/launch.jsonファイル内の設定により、デバイス上のSafariでURLを開くかSafari内のtabで開くことができる。通常localhostのHTTPサーバーであることが多いローカルの開発サーバーへ簡単にアクセスできるように、Microsoftはポートフォワーディングをエミュレートするため、Appleによりネイティブでサポートされていないlocaltunnelの利用を決めた。LocaltunnelはローカルウェブサーバーへのすべてのリクエストをユニークかつパブリックにアクセスできるURLを通してプロキシーできる。これにより開発機のDNSやファイアウォールの設定を変更することなくローカルウェブサービスを共有することが出来る。

以下はDebugger for iOS Webがサポートしている機能のリスト:

  • ブレークポイントの設定
  • コー=ド実行のステップスルー
  • スタックトレース
  • evalスクリプト、スクリプトタグ、動的に追加されるスクリプトのデバッグ
  • ウォッチ
  • コンソール

Visual Studio Codeの拡張機能Debugger for iOS WebはVisual Studio Code Marketplaceで提供されている。

 
 

Rate this Article

Relevance
Style
 
 

この記事に星をつける

おすすめ度
スタイル

こんにちは

コメントするには InfoQアカウントの登録 または が必要です。InfoQ に登録するとさまざまなことができます。

アカウント登録をしてInfoQをお楽しみください。

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

コミュニティコメント

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

HTML: a,b,br,blockquote,i,li,pre,u,ul,p

BT

あなたのプロファイルは最新ですか?プロフィールを確認してアップデートしてください。

Eメールを変更すると確認のメールが配信されます。

会社名:
役職:
組織規模:
国:
都道府県:
新しいメールアドレスに確認用のメールを送信します。このポップアップ画面は自動的に閉じられます。