22

Web ページに添付されたスクリプトから WebKit の「開発者ツール」を開く方法を探しています。Google Chrome と Safari の両方のソリューションが必要です。これは、まだ開いていない場合は開発者ツール ペインを開き、(できれば方法がわかれば) 開いたときにそのペインの特定のタブ/セクションにも切り替えます。

(ユースケース、興味がある場合: エラーが発生し、開発者がページを見ている場合、出力ウィンドウを開きたいと思いconsole.logます。この特定のページは、いくつかの JavaScript 単体テストの出力になります。)

私はこの質問に報奨金を設定しています。なぜなら、それは明らかにこれまで誰も満足に答えられていないものであり、答えは毛むくじゃらのものだからです. 1)両方のブラウザーで動作し、2) 静的 Web ページからは動作しないプライベート拡張 API を必要としないという本当の答えがない限り、回答しないでください。

(関連するが、Chrome および拡張機能に固有) を参照してください: Can I open the devtools from a Google Chrome extension?

4

5 に答える 5

14

単純に:できません。

開発ツールは (他の Web ページとは異なり) サンドボックス化されていないため、サンドボックス化された環境に、サンドボックス化されていない環境を開いて制御する権限を付与することは、セキュリティ設計の重大な欠陥です。

これがあなたの質問に答えてくれることを願っています:-)

于 2013-06-04T06:52:48.577 に答える
10

Web ページから Chrome の Dev Tools を直接使用することはできません。ブラウザに同梱されています。

ただし、通常の Web アプリケーションのように使用できます。Chrome Developer Tools に移動し、Contributingに移動します。アプリの Dev Tools の使用に関するヘルプが表示されます。

設定中

  • Mac OS / Windows に Chrome Canary をインストールするか、Linux の Chromium 連続ビルド アーカイブから最新の Chromium ビルドをダウンロードします。
  • https://chromium.googlesource.com/chromium/blink.gitから Blink git リポジトリのクローンを作成します。
  • 一部のポート (8090) で WebKit/Source/WebCore/inspector からファイルを提供するローカル Web サーバーをセットアップします。

ランニング

  • 次のコマンド ライン フラグを使用して Chrome Canary のコピーを 1 つ実行します。 --remote-debugging-port=9222 --user-data-dir=blink/chromeServerProfile --remote-debugging-frontend="http://localhost:8090/ front_end/inspector.html". これらのフラグにより​​、Chrome は localhost:9222 への websocket 接続を許可し、ローカル git リポジトリからフロントエンド UI を提供します。(chromeServerProfile へのパスをシステム内の書き込み可能なディレクトリに調整します)。
  • サンプル ページ (例: www.chromium.org) を開きます。
  • コマンドライン フラグ --user-data-dir=/work/chromeClientProfile を使用して、Chrome Canary の 2 つ目のコピーを実行します。開くhttp://localhost:9222。サムネイルの中には、他のブラウザー インスタンスのサンプル ページが表示されます。それをクリックして、サンプル ページのリモート デバッグを開始します。
  • 開く DevTools Web ページは、ローカル ファイルシステムの git リポジトリから提供される最初のブラウザー インスタンスの remote-debugging-frontend から提供されます。この Devtools Web ページをデバッグし、他の Web アプリと同様にそのソースを編集します。

これがあなたが必要とするものであることを願っています。

于 2013-05-31T11:01:50.500 に答える
5

ほとんどのロギング機能を提供するConsole APIを使用する以外に、ページ内スクリプトから Web 開発者ツールを制御する方法はありません。スクリプトにそれ以上の制御を許可すると、Web ページがブラウザの一部を制御できるようになるため、深刻なセキュリティ上の問題になります。

実行しようとしていることにリモートで関連する唯一の API はdebugger、開発者ツールが既に開いている場合にのみスクリプト ウィンドウに切り替えるコマンドです。

しかし、誰のためにこの機能を開発しようとしているのですか?

サイトで作業している開発者向けの場合は、既存の開発者ツールを手動で使用するか、ブレークポイントを設定するか、例外で一時停止するトグルを使用することをお勧めします。

エンド ユーザー向けの場合は、しないでください。高度な技術を持つ Web 開発者がサイトを使用することを想定していない限り、開発者ツールで突然エラーが表示された場合にのみ、ユーザーを怖がらせることができます。

本当にエラーを表示したい場合は、独自のロギング フレームワークとエラー レポート用の UI を実装できます。これは、基本的な JS で動作し、特定のブラウザー環境に依存しません。

于 2013-06-01T18:16:52.997 に答える
0

いいえ、セキュリティで保護されたブラウザでは、スクリプトが拡張機能を開くことはできません。

ただし、アドオン/拡張機能またはコンソール API を設計して、特定のサイトに対して同じことを行うことができます。

このようなアドオンを作成して、その要件を達成します。

キー 'CTRL' + SHIFT' + 'I' を送信してみてください。これは Chrome や FireFox で機能する可能性があります (IE では 'F12' を使用する必要があります)

このアドオンでは、ビルトインよりも機能するユーティリティが少ないため、必要なときに使用しています。

編集: 現在、Chrome は多くの新しい進歩sourceで進歩しています。

これが役立つことを願っています！

于 2013-06-04T05:23:35.767 に答える