2012-09-12 17 views
14

windowの中に新しいオブジェクトを提供するChrome拡張機能を作りたいと思います。 Webページが拡張機能がロードされたブラウザで表示される場合、window.mythingをJavascript経由で利用可能にしたいと思います。 window.mythingオブジェクトには、拡張機能で定義するいくつかの関数があります。これらの関数は、拡張機能が有効になっているブラウザでページを表示すると、console.logまたは任意のJavascriptファイルから呼び出すことができます。Chrome拡張機能からウィンドウオブジェクトを変更できますか?

私は成功しContent Scriptを使って、ページにJavaScriptファイルを注入することができました:

var s = document.createElement("script"); 
s.src = chrome.extension.getURL("mything.js"); 
document.getElementsByTagName("head")[0].appendChild(s); 

mything.jsは次のようになります。

window.mything = {thing: true}; 
console.log(window); 

するたびにページが読み込まれると、私は見ます私はそれがコンソールにあると期待しているので、全体windowオブジェクト。しかし、私はコンソールからwindow.mythingオブジェクトと対話できません。注入されたスクリプトがグローバルwindowオブジェクトを実際に変更していない場合は、

グローバルwindowオブジェクトをChrome拡張機能から変更するにはどうすればよいですか?

+0

これは不可能です。あなたは正しいコンソールを見ていますか、スクリプトは本当に実行されていますか(ドキュメントを調べ、スクリプトタグを探したり、構文エラーがないかチェックしますか?スクリプトは確実にページのコンテキストで実行されるため、「mything」は存在していなければなりません。 –

答えて

27

直接にはできません。 content scripts documentation

ただし、コンテンツスクリプトにはいくつかの制限があります。彼らのことはできません。

  • 使用クローム* APIはその拡張機能のページで定義された
  • 使用変数や関数(chrome.extensionの部品を除く)
  • 使用変数や関数は、Webページまたは他で定義されました。コンテンツスクリプト

(強調追加)

コンテンツスクリプトが見るwindowオブジェクトは、ページに表示されるオブジェクトと同じではありません。window

ただし、window.postMessageメソッドを使用すると、DOMを介してメッセージを渡すことができます。あなたのページとコンテンツの両方のスクリプトはメッセージイベントを聞き取り、そのうちの1つからwindow.postMessageを呼び出すたびに、もう1つがそれを受信します。 「コンテンツスクリプト」ドキュメントページにはexample of thisがあります。

編集: コンテンツスクリプトからスクリプトを挿入することで、ページにいくつかのメソッドを追加する可能性があります。まだpostMessageのようなものを使用せずに、しかし延長の残りの部分と背面通信することができないだろうが、あなたは、少なくともにいくつかのものを追加することができ、私は遊んでてきたページのwindow

var elt = document.createElement("script"); 
elt.innerHTML = "window.foo = {bar:function(){/*whatever*/}};" 
document.head.appendChild(elt); 
+0

おかげさまで、私はあなたの提案をそのまま使用しませんでしたが、このコンセプトは本当の問題をゼロに助けました。 –

+0

Uはまた、eval( "window.foo = {bar:function(){/ *何でも* /}};"; – User

+0

@Userいいえ、私はそれを試しました。 – cprcrack

4

この。私は私のJavaScriptをwindow.location = callにラップすることで、ブラウザのウィンドウオブジェクトと対話できることを発見しました。

var myInjectedJs = "window.foo='This exists in the \'real\' window object';" 
window.location = "javascript:" + myInjectedJs; 

var myInjectedJs2 = "window.bar='So does this.';" 
window.location = "javascript:" + myInjectedJs2; 

これは機能しますが、設定されているwindow.locationの最後のインスタンスに対してのみ有効です。あなたは、ドキュメントのwindowオブジェクトにアクセスする場合は、変数「バー」ではなく「foo」という

0

コンテンツスクリプトでき呼び出し、その後windowオブジェクトを変異させるために使用することができますwindowメソッドを持っています。これは<script>タグ注入よりも簡単であり、<head><body>がまだ解析されていなくても(例えば、run_at: document_startを使用している場合でも)機能します。

// In Content Script 
window.addEventListener('load', loadEvent => { 
    let window = loadEvent.currentTarget; 
    window.document.title='You changed me!'; 
}); 
0

クロム拡張のcontent_scriptは、ウィンドウとは別の独自のコンテキスト内で実行されます。しかし、ページのウィンドウと同じコンテキストで実行されるように、ページにスクリプトを挿入することができます:Chrome extension - retrieving global variable from webpage

ウィンドウオブジェクトのメソッドを呼び出してウィンドウのプロパティを変更するには、基本的にscript.jsをページのDOM:

var s = document.createElement('script'); 
s.src = chrome.extension.getURL('script.js'); 
(document.head||document.documentElement).appendChild(s); 
s.onload = function() { 
    s.remove(); 
}; 

とその注入されたスクリプトファイルでカスタムイベントリスナを作成:

document.addEventListener('_my_custom_event', function(e) { 
    // do whatever you'd like! Like access the window obj 
    window.myData = e.detail.my_event_data; 
}) 

とcontent_scriptにそのイベントをディスパッチ:

var foo = 'bar' 
document.dispatchEvent(new CustomEvent('_save_OG_Editor', { 
    'detail': { 
    'my_event_data': foo 
    } 
})) 

またはその逆。 script.jsにイベントを送信し、あなたの内線のcontent_scriptでそれを聞きます(上のリンクがよく説明しているように)。

注入されたスクリプトを拡張機能ファイルに追加し、スクリプトファイルのパスをmanifest within "web_accessible_resources"に追加するだけでエラーが発生します。

誰かを助ける希望\

関連する問題