Chrome拡張機能のコンテキストメニューからJavaScriptが実行されない

Question

免責事項：JavaScriptを初めて使用しています。以前はChrome拡張機能を開発したことがありません。

ユーザーがページ上でテキストを選択し、右クリックしてコンテキストメニューボタンをクリックしたときにJavaScriptを実行するChrome拡張機能を開発しようとしています。私は、私が書いたJavaScriptが期待どおりに動作することを（Chromeコンソールからの実行に基づいて）決定しました。今はすべて延長が必要です。

私はロードを取得することができ、私はそれをページに表示され、実行されるように表示することができます。しかし、何もしていないようで、コンソールは出力を返しません。 （私はイベントページでインラインJavaScriptを実行できないので、addListenerを使用していると読んでいます。）コンテキストメニューを正しく設定しましたか？スクリプトにエラー（または複数）がありますか？あなたのmanifest.jsonをする "コンテンツスクリプト" を追加する必要が

manifest.jsonを

{ 
    "name": "My Extension", 
    "description": "sample", 
    "version": "0.0.1", 
    "permissions": ["contextMenus"], 
    "background": { 
    "persistent": false, 
    "scripts": ["background.js"] 
    }, 
    "manifest_version": 2 
} 

background.js

chrome.runtime.onInstalled.addListener(function() { 
    var context = "selection"; 
    var title = "My Extension"; 
    var id = chrome.contextMenus.create({"title": title, "contexts":[context], 
             "id": "context" + context}); 
}); 

chrome.contextMenus.onClicked.addListener(getSHA); 

// Get file path of file to be staged 
// Get SHA 
function getSHA(){ 
    stagedFile = window.getSelection().toString() 
    console.log(stagedFile) 
    baseURL = window.location.href.slice(0, -6); 
    prNumber = baseURL.slice(-4); 
    xhr = new XMLHttpRequest(); 
    xhr.open("GET", "https://api.github.com/repos/kubernetes/kubernetes.github.io/pulls/"+prNumber, false); 
    xhr.send(); 
    json_data = JSON.parse(xhr.responseText); 
    shaValue = (json_data.head.sha) 
    console.log("SHA: "+shaValue) 
    getNetlify; 
}; 

// Get Netlify URL 
function getNetlify(){ 
    xhr2 = new XMLHttpRequest(); 
    xhr2.open("GET", "https://api.github.com/repos/kubernetes/kubernetes.github.io/commits/"+shaValue+"/status", false); 
    xhr2.send(); 
    json_data2 = JSON.parse(xhr2.responseText, function(key, value) { if (key == "target_url" && value.includes("netlify")) { netlifyURL = value; }}); 
    openStaging 
}; 

// Stage file 
function openStaging(){ 
    window.open(netlifyURL+"/"+stagedFile) 
}; 

Answer 1

。これが、実行するページに注入されるコードの種類です。バックグラウンドスクリプトはページにアクセスできませんでした。だから、コンテンツスクリプトのドキュメントをチェックしてください。 https://developer.chrome.com/extensions/content_scripts

あなたのmanifest.jsonにあなたのコードに次の曲を追加する必要があります。

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

このコードでは、ユーザーが「一致」Iに指定されたURLを、拡張することをサイトに行くの任意の時間をそのページにmystyles.cssとmyscript.jsを注入します。だからあなたのパターンはhttp*://*/*のようなものになります。これは、ユーザーが行くすべてのページにスクリプトを挿入します。

次に、達成しようとしていることを達成するために、バックグラウンドスクリプトは必要ありません。だからあなたはmanifest.jsonからそれを削除することができます。

だからあなたmanifest.jsonは次のようになります。

{ 
    "name": "My Extension", 
    "description": "sample", 
    "version": "0.0.1", 
    "permissions": ["contextMenus"], 
    "content_scripts": [ 
    { 
     "matches": ["http://www.google.com/*"], 
     "css": ["mystyles.css"], 
     "js": ["myscript.js"] 
    } 
    ], 
    "manifest_version": 2 
} 

はその後myscript.jsファイル（またはものは何でもあなたがあなたを呼びたい）にコードを入れて、あなたは、ページ上で実行するには、このスタートが表示されるはずです。