2

アイコンをクリックすると、検索に使用するテキストフィールドとボタンを表示するChrome拡張機能があります。表示されるコンテンツは、基本的に次のようなマニフェストから呼び出されるHTMLドキュメントです。

"browser_action": {
    "default_popup": "popup.html"
 }

さて、問題は、javascriptを使用して、ブラウザにロードされている現在のドキュメントにどのようにアクセスできるかということです。テキストフィールドから質問を抽出して、現在のドキュメントで答えを見つけたいからです。

ありがとうございました！

編集1：

コード：

マニフェスト.json

{
  "name": "SmartSearch",
  "version": "1.0",
  "manifest_version": 2,
  "description": "Smart Search extension for Google Chrome.",
  "content_scripts": 
  [
  {
    "matches": ["<all_urls>"],
    "js": ["smartsearch.js"]
  }
  ],
  "browser_action": {
     "default_icon": "icon.png",
"default_popup": "popup.html"
  }

}

smartsearch.js

SmartSearch() = function (){

    var x = document.title;
    alert(x);
}
window.onload = SmartSearch;

popup.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <title>Smart Search</title>
    <script type="application/javascript" src="smartsearch.js"></script>
  </head>
  <body>
    <p>Smart Search</p>
    <form>
      <input type="text" id="search_text_field"></input>
      <input type="button" id="search_button" value="Search"/>
    </form>
  </body>
</html>

今のところ、私がやりたいのは、拡張機能アイコンを押したときに現在ロードされているページのタイトルを表示することだけです。DOMにアクセスできるかどうかを確認するだけです。問題は、ポップアップのタイトルを取得することです。解決策は何ですか？

EDIT2： ページに移動すると、ページの読み込み時にページのタイトルが記載されたアラートが表示されることがわかります（YouTubeページなどの例外があります）が、拡張機能のアイコンを押すと表示されます。

4

2 に答える 2

2

次のようにマニフェストで宣言できるコンテンツ スクリプトを使用する必要があります。

  {
  "name": "My extension",
  ...
  "content_scripts": [
    {
      "matches": ["http://www.google.com/*"],
      "css": ["mystyles.css"],
      "js": ["jquery.js", "myscript.js"]
    }
  ],
  ...
}

matchesスクリプトを使用するドメインはどこですか。そうすれば、css と js はドキュメント自体の中にあります。ただし、ドキュメントからプラグインにデータを送信する必要がある場合は、Message Passingを使用する必要があります。ここでは、コンテンツ スクリプトからプラグインにメッセージを送信する方法の例を示します。

  chrome.extension.sendMessage({greeting: "hello"}, function(response) {
      console.log(response.farewell);
  });

そしてchrome.extension.onMessage.addListener、メッセージを受信するために使用する必要があります。例：

    chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
          console.log(sender.tab ?
              "from a content script:" + sender.tab.url :
              "from the extension");
          if (request.greeting == "hello")
              sendResponse({farewell: "goodbye"});
  });

一方、プラグインからコンテンツ スクリプトにメッセージを送信する場合は、使用する必要があります。

chrome.tabs.getSelected(null, function(tab) {
  chrome.tabs.sendMessage(tab.id, {greeting: "hello"}, function(response) {
    console.log(response.farewell);
  });
});

chrome.extension.onMessage.addListenerそして、反対側でメッセージを受信するには、以前と同じです。

これは、開始するための非常に優れたリソースです。

編集: content_scripts の初期化の実例

マニフェスト:

    {
    "name": "Intervention",
    "version" : "1.0",
    "content_scripts": [
    {
      "matches": ["http://*/**"],
      "js": ["action.js"]
    }

   ],

  "manifest_version" : 2
}

JS

var element = document.title;
alert(element);
于 2013-01-18T19:08:00.583 に答える
0

ページでコンテンツ スクリプトを実行し、メッセージ パッシングを使用して、拡張機能とタブの間でやり取りしたいと考えています。

コンテンツ スクリプトは拡張機能からリクエストを受け取り、ページ上で計算を行います (DOM にアクセスできるので、ページ上で何でもできるはずです)。

コンテンツ スクリプトは、ポップアップに表示できる応答を拡張機能に送り返します。

于 2013-01-18T19:05:23.807 に答える