web-dev-qa-db-ja.com

Chrome拡張子のbackground.jsからコンソールメッセージを読み取る場所

Google Chrome拡張機能で始めたばかりで、バックグラウンドjsからコンソールにログを記録できないようです。エラーが発生した場合（たとえば、構文エラーのため）、エラーメッセージも見つかりません。

私のマニフェストファイル：

{
  "name": "My First Extension",
  "version": "1.0",
  "manifest_version": 2,
  "description": "The first extension that I made.",
  "browser_action": {
    "default_icon": "icon.png"
  },
  "background": {
    "scripts": ["background.js"]
  },
  "permissions": [
    "pageCapture",
    "tabs"
  ]
}

background.js：

alert("here");
console.log("Hello, world!")

拡張機能をロードすると、アラートが表示されますが、コンソールに何も記録されていません。私は何を間違えていますか？

debugginggoogle-chrome-extensionconsolegoogle-chrome-devtools
170
grasaved

あなたは間違った場所を見ています。ログに記録されたコンソールメッセージはWebページではなく、（非表示の）バックグラウンドページに表示されます。コンソールでこれらのメッセージを表示するには、次の手順を実行します。

chrome://extensions/にアクセスしてください。
拡張機能アイコンを右クリックして、[拡張機能の管理]をクリックすることもできます。

  1. 開発者モードを有効にする
  2. 背景ページのリンクをクリックします（「ビューの検査」で）。
  3. このページの開発者コンソールが開きます。

新しいUI：

enter image description hereenter image description here

古いUI：

image

343
Rob W

同じ問題がありました。私の場合、Chrome Developer toolsのコンソールタブでログが[すべて非表示]に設定されていました。私はこれがオプションであることにさえ気づかなかったし、それをオフにしたことを覚えていない

screenshot of setting in console tab in chrome dev tools

12
Michiel

chrome拡張機能の「コンテンツスクリプト」のデバッグコンソールを表示したいフォロワーの場合、通常の「開発者コンソールの表示」を実行し、ドロップダウン矢印を使用して「javascript環境」を選択します。その後、そのメソッドなどにアクセスできます。

enter image description here

5
rogerdpack

さらに

manifest.jsonのcontent_script jsファイル（「バックグラウンド」プロパティが設定されていない場合）を表示する場合

"content_scripts": [{
    "matches": ["<all_urls>"],
    "js": ["popup.js"],
  }]

"browser_action": {
    "default_icon": "icon_32.png",
    "default_popup": "popup.html"
  }

次に、拡張機能アイコンを右クリックして、ポップアップと開発者ウィンドウを確認しますpopup.htmlを開いた状態で開き、コンソールタブが表示されます。

5
diEcho

私もこの問題を抱えていました。私のWebページが新しく保存されたスクリプトに更​​新されていないようです。これは、chromeブラウザでCtrl + refresh（またはCtrl + F5）を押すことで解決しました。

1
Jordan

Michielの答えと同様に、私は面白いコンソール構成も持っていました：設定を覚えていないフィルター：

enter image description here

フィルターをクリアした後、メッセージが表示されました。

0
BigDataScientist