JavaScript注入无法正常工作

Question

我将脚本标记注入外部文件作为src，然后我调用回调函数，以注入HTML。但是当我调试时，它就像这样：

1. 注入jquery。
2. 注入HTML（回调函数）
3. 注入其余的脚本标记。

有人可以解释我如何解决这个问题吗？

1. 注入所有脚本。
2. 注入HTML。

Injection.js文件：

injectJavaScripts([
    "lib/jquery/dist/jquery.js",
    "lib/angular/angular.js",
    "lib/angular-route/angular-route.js",
    "lib/ui-router/release/angular-ui-router.js",
    "src/app.js",
    "src/LoginController.js",
    "src/LogoutController.js",
    "src/MainController.js"
], function() {
    injectHTML();
});

function injectJavaScripts(urls, callback) {
    var elements = [];
    urls.forEach(function (url) {
        var s = document.createElement('script');
        s.src = chrome.extension.getURL(url);
        elements.push(s);
    });

    var target = document.body || document.documentElement;
    var i = 0;
    var patchNext = function () {
        if (i >= elements.length) return;
        else if (i > 0) {
            elements[i - 1].onload = null;
        }

        elements[i].onload = patchNext;
        target.appendChild(elements[i]);

        i += 1;
    };
    patchNext();
    callback();
};

function injectHTML() {
    var logged = false;
    var cheapWatcherDiv = document.createElement('div');
    cheapWatcherDiv.setAttribute('class', 'cheap-watcher');
    document.body.appendChild(cheapWatcherDiv);

    if (logged == false) {
        $(".cheap-watcher").load(chrome.extension.getURL('views/main.html'));
        $('head').append('<link rel="stylesheet" href="' + chrome.extension.getURL('sass/main.css') + '" type="text/css" />');
    } else {
        $(".cheap-watcher").load(chrome.extension.getURL('views/logoutTemplate.html'));
    }
};

Answer 1

您正在调用错误位置上的patchNext，该位置应该在注入所有脚本后调用。但是，您在第一次致电injectJavaScripts后打电话。

在注入所有脚本时，修改callback()以调用function injectJavaScripts(urls, callback) { var elements = []; urls.forEach(function (url) { var s = document.createElement('script'); s.src = chrome.extension.getURL(url); elements.push(s); }); var target = document.body || document.documentElement; var i = 0; var patchNext = function () { if (i >= elements.length) { // All scripts are injected now // ok to invoke callback() here callback(); return; } else if (i > 0) { elements[i - 1].onload = null; } elements[i].onload = patchNext; target.appendChild(elements[i]); i += 1; }; patchNext(); // callback(); don't call here }; 。

AttachedFile.objects.create(message=cm, file=ContentFile(b64decode(value.split('base64,')[1]), key))