0

コンテンツ スクリプトを使用して、独自の JS ファイルをページに挿入しようとしています。私がこれを行おうとしている方法は、dotjs と呼ばれる Chrome 拡張機能で使用されるシステムに基づいています。この拡張機能は、マシン上で小さなサーバーを実行し、そのサーバーからファイルを取得するために AJAX を localhost に再要求します。

Same Origin Policy により、コンテンツ スクリプトではなく background.js から送信された場合にのみ、これらの AJAX リクエストが通過することはかなり確実です。また、バックグラウンド ページでのみ機能する webRequest も使用する必要があります。ただし、ページ自体に内容を挿入する必要があるため、コンテンツ スクリプトが必要です。したがって、私の拡張機能は、バックグラウンド ページにメッセージを送信するコンテンツ スクリプトと連携し、必要なすべての webRequest と AJAX を実行するように要求します。

問題は、メッセージが background.js によって受信されていないように見えることです。ご覧のとおり、background.js の onRequest ハンドラに console.log() がいくつかありますが、それらはコンソールに表示されません。

マニフェスト.json

{
  "name": "dotjs",
  "version": "1.5",
  "description": "~/.js",
  "icons": { "48": "icon48.png",
            "128": "icon128.png" },
  "content_scripts": [{
    "all_frames": true,
    "run_at":     "document_start",
    "matches":    ["[censored]"],
    "js":         ["dotjs.js"]
  }],
  "background": {
    "scripts": ["jquery.js", "background.js"]
  },
  "permissions": ["tabs", "webRequest", "extension"]
}

dotjs.js

console.log("dotjs.js running");

var requestFilter =
    {
        url: "[censored]"
    };

var blockingResponse =
    {
        redirectUrl: "http://localhost:2262/Pigman/ips.chat.js"
    };  

function requestInterceptor(details)
{
    return blockingResponse;
}

chrome.extension.sendRequest(
    {
        type: "setListener",
        func: requestInterceptor,
        filter: requestFilter
    }
);

chrome.extension.sendRequest(
    {
        type: "loadJS",
        filename: "Elizabot/elizabot.js"
    },
    function (response) { eval(response); }
);

chrome.extension.sendRequest(
    {
        type: "loadJS",
        filename: "Elizabot/elizadata.js"
    },
    function (response) { eval(response); }
);

background.js

function loadJSFile(filename)
{
    $.ajax({
        url: 'http://localhost:2262/Pigman/' + filename + '.js',
        dataType: 'text',
        success: function(d){
            return d;
        },
        error: function(){
            console.log('no file found at localhost:2262/' + filename + '.js')
        }
    });
}

chrome.extension.onRequest.addListener(
    function(request, sender, sendResponse)
    {
        console.log("background.js received request:");
        console.log(request);
        if (request.type == "setListener")
        {
            chrome.webRequest.onBeforeRequest.addListener(request.func, request.filter);
        }
        if (request.type == "loadJS")
        {
            sendResponse(loadJSFile(request.filename));
        }
    }
);
4

1 に答える 1

2

あなたのコード/設計には多くの欠陥があります:

  1. リソース URL がマニフェスト ファイルのセクションで指定されている場合、コンテンツ スクリプトはクロスオリジン AJAX 要求を行うことができます。permissions
  2. API は、webRequestChrome 拡張機能のスコープ内で作成されたリクエストをキャプチャしません。
  3. ハンドラ内のreturnステートメントは、次の呼び出し元に応答を返しませ:successloadJSFile

        sendResponse(loadJSFile(request.filename));
    ...
    function loadJSFile(filename) {
        $.ajax({
            ...
            success: function(d){
                return d;
            } ...
    

    少なくとも次を使用します。

    loadJSFile(request.filename, sendResponse);
    function loadJSFile(filename, sendResponse) {
        $.ajax({
            url: 'http://localhost:2262/Pigman/' + filename + '.js',
            dataType: 'text',
            success: sendResponse, /// <--- Now it works!
    

デバッグに関する最後の注意: メッセージがコンソールに記録されていることは確かです。あなたは間違った場所を見ているだけです。バックグラウンド ページのコンソール出力を読み取る手順については、Google chrome 拡張機能 - background.js からのログ記録を参照してください。

于 2012-05-01T20:27:45.483 に答える