AndroidフォンのChromeで開発者ツールコンソールを開くことはできますか?


165

AngularJSアプリケーションはデスクトップでは正常に動作しますが、モバイルでは適切にレンダリングされません(実際のコードが表示されています)。これはAndroidフォンです。

コンソールに表示されているエラーを確認したいのですが。

モバイルのChromeアプリ(デスクトップのように)でJSコンソールを開くことはできますか?

回答:


134

あなたはリモートデバッグを使用してそれを行うことができます、これは公式のドキュメントです。基本的なプロセス:

  1. Androidデバイスを接続する
  2. デバイスを選択:[その他のツール]> [ *PC / Macの開発ツールからデバイスを検査] 。
  3. あなたの携帯電話で承認します。
  4. 幸せなデバッグ!!

* これは現在「リモートデバイス」です。


2
詳細な説明はドキュメントのリンクに記載されていると思います
PseudoAj

59
これは外部コンピューターなしで可能ですか?
エリックリード

59
AndroidフォンのChromeでオープンなデベロッパーツールコンソールを要求する質問ですか?あなたの魂は別のデバッグマシンを必要とします。あなたの答えでは、デバッグは電話自体ではありません
Fennekin

5
私が@fennekinを知っている他の方法はありません。より良い方法があると思われる場合は、お気軽に更新してください
PseudoAj

5
2019年
Abhinav Singh

53

手元にPCがない場合は、モバイルブラウザー用の開発ツールであるErudaを使用できますhttps://github.com/liriliri/eruda
埋め込み可能なJavaScriptとブックマークレットとして提供されています(ブックマークレットをChromeに貼り付けると、 javascript:プレフィックスなので、自分で入力する必要があります)


1
単独のモバイルデバイスでの開発を実現するTermuxのようなツールと非常に相性が良いです。私はすでにeruda-webpack-plugin1つのプロジェクトに統合しています:npm i eruba-webpack-plugin --save-optional
vintproykt

コンソールの内容を取得する最も簡単な方法
makwana.a

素晴らしいソリューション。CDNで入手できます。
netishix

これは私にはうまくいかないようです。それをアドレスバーに貼り付けても(「javascript:」と読み直しても)、何も実行されないようです。
BT

@BT一部のWebサイトは、リストされた許可されたドメインからのスクリプトのロードに制限しています。別のWebサイトで試してください。
trogper

10

コンソールで何が印刷されたかを確認したいだけなのに、「印刷された」部分をHTMLのどこかに追加して、Webページに表示されるようにします。自分で行うこともできますが、これを行うJavaScriptファイルがあります。あなたはそれについてここで読むことができます:

http://www.hnldesign.nl/work/code/mobileconsole-javascript-console-for-mobile-devices/

コードはGithubから入手できます。ダウンロードしてjavasciptファイルに貼り付け、HTMLに追加できます。


参考:コンソールが表示されない状況が発生する可能性があります。公式ホームページの最後にある会話に基づいて、明示的mobileConsole.init()に試すことができます。そのトリックは私の場合に役立ちます。YMMV。
RayLuo

1
そのリンクはまだ機能しますが、ロードに時間がかかります。それにもかかわらず、私とそのlib所有者の間の会話が、彼のメインページの[Notes]セクションに次の情報を追加したことをまとめることができます。 overrideAutorunをtrueに設定するか、次のスクリプトをページに追加します:if (!mobileConsole.status.initialized) { mobileConsole.init(); } "
RayLuo

7

自分でお願いして、簡単ボタンを押してください:

PlayストアからWeb Inspector(オープンソース)をダウンロードします

警告:ATTOW、コンソール出力は残りのパラメーターを受け入れません!つまり、次のようなものがあれば:

console.log('one', 'two', 'three');

あなただけが表示されます

1

コンソールに記録されます。次のように、paramsを手動で配列にラップして結合する必要があります。

console.log([ 'one', 'two', 'three' ].join(' '));

予想される出力を確認します。

しかし、アプリはオープンソースです!パッチは差し迫っているかもしれません!パッチャーはあなたかもしれません!


3

Kiwi BrowserはモバイルChromiumであり、拡張機能をインストールできます。Kiwiをインストールしてから、「Mini JS console」Chrome拡張機能をインストールします(Googleで検索してChrome拡張機能のWebサイトからインストールするだけで、uBlockも機能します;)。下部のKiwiメニューで利用できるようになり、現在のページのコンソール出力が表示されます。


-1

あなたはおそらくGear Browserを試すかもしれません、それはちょうどモバイルで要素を検査してウェブサイトをデバッグすることができます。

https://gear4.app


5
アプリはiPhone専用です。質問はAndroidを指定しました。
ピート
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.