1

この質問を読みました DOM に存在するものをオーバーライドする JavaScript コードを挿入することは可能ですか? ほとんどの場合、ソリューションはうまく機能しますが、ページ内の JavaScript コードが最初に実行され、次に content_scripts が実行されるように見えることがあります。

これにより、「OVVERRIDES」が失敗することがあります。

以下のような私のテストコード：

//manifest.json
"content_scripts": [
{
    "matches": ["http://*/*"],
    "js": ["js_injector.js"],
    "run_at": "document_start"
}

//js_injector.js
function injectJs(link) {
var scr = document.createElement('script');
scr.type="text/javascript";
scr.src=link;

document.documentElement.appendChild(scr);
}
injectJs(chrome.extension.getURL('my.js'));

//my.js
console.log("in my.js");
function foo() {
    console.log("in my.js foo");
}

//test.html (view this page in chrome)
<html>
<script type="text/javascript">
    console.log("I am here 1110");
    foo()
    console.log("I am here 1111");
</script>
</html>

通常、以下のログを取得します。

in my.js my.js:114
I am here 1110 test.html:4
in my.js foo my.js:116
I am here 1111 test.html:6

ただし、以下のログが取得される場合があります。

I am here 1110 test.html:4
Uncaught ReferenceError: foo is not defined test.html:5
in my.js test.js:114

ページとコンテンツ スクリプトでコードを実行する順序はランダムに見えますか? 私の目的は、コンテンツ スクリプトで定義された js API をターゲット ページで実行できるようにすることです。誰かがそれを修正する方法を知っていますか? ありがとう！

4

2 に答える 2

0

実行の順序は確かにランダムではありません。

関数 injectJS が行っているのは、「src」フィールドがmy.js. 次に、それを HTML に挿入します。つまりmy.js、非同期に含まれます。

これが test.html が見ているものです：

<script src="my.js"></script>

非同期であるため、my.js のコンテンツは常に必要なときに読み込まれるとは限りません。この問題を軽減するには、 を含めずmy.jsに のコンテンツを含めますmy.js。

Broswerify の brfsを使用require()すると、ブラウザ側のコードにステートメントを挿入して、実際のファイルの内容を挿入することができます。適切なインストール後、js_injector.js次のものが必要になります。

//js_injector.js

var fs = require('fs');

function injectJs(link) {
    //Create script tag with full file content as the content
    var scr = document.createElement('script');
    link = fs.readFileSync(__dirname + '/inject.js', 'utf-8');
    scr.textContent = link;

    (document.head || document.documentElement).appendChild(src);
}

injectJs('my.js');

これにより、次の結果と期待される動作が得られます。

//test.html

<script> 
    console.log("in my.js");
    function foo() {
        console.log("in my.js foo");
    }
</script>
于 2015-06-16T17:28:15.643 に答える