需要帮助来修复 Mozilla 插件

Question

我需要帮助来解决我的 mozilla 插件问题。我需要在正文中附加我的 html 代码，为此我在我的服务器上发送请求以检查用户会话。请求响应后，我想根据用户状态附加 html。在我的代码中它说 jQuery 没有定义。这是我的 main.js 代码：

var buttons = require('sdk/ui/button/action');
var tabs = require("sdk/tabs");
var button = buttons.ActionButton({
id: "mozilla-link",
label: "Visit Mozilla",
icon: {
    "16": "./icon-16.png",
    "32": "./icon-32.png",
    "64": "./icon-64.png"
}

});
var data = require("sdk/self").data;
var request = require("sdk/request");
var contentScriptString = '';
var text ='';
var pageMod = require("sdk/page-mod").PageMod({
include: "*",
contentScriptFile: data.url("jquery.min.js"),
contentScriptWhen: "ready",
onAttach: function(worker) {
    var tabUrl = worker.tab.url;

    var mapObj = {
        'http://': "",
        'https://': ""

    };
    var re = new RegExp(Object.keys(mapObj).join("|"), "gi");
    tabUrl = tabUrl.replace(re, function(matched) {
        return mapObj[matched];
    });
    tabUrl = tabUrl.split("/");
    if (tabUrl) {
        request.Request({
            url: "https://www.karmora.com/checkstore/" + tabUrl[0],
            onComplete: function(response) {
                console.info(response.json);
                if (response.json.storeId !== null) {
                    var storeName = response.json.storeTitle;
                    var amount = response.json.commPercentage;
                    var store_id = response.json.storeId;
                    text = '<img src="https://www.karmora.com/download.png">';
                    if (response.json.loginStatus) {


                        if (response.json.visitStatus === true) {
                            text = '<img src="https://www.karmora.com/activated_account.png">';
                        } else {
                            var url_check = "https://www.karmora.com/index/VisitExtension/" + store_id;
                            request.Request({
                                url: url_check,
                                onComplete: function(response) {
                                    location.href = response.json;
                                }
                            });
                            console.info(url_check);
                            text = '<a href="https://www.karmora.com/index/VisitExtension/' + store_id + '"><img src="https://www.karmora.com/activate.png"></a>';

                        }
                    } else {
                        text = '<a href="https://www.karmora.com/"><img src="https://www.karmora.com/download.png"></a>';
                    }
                    writecanvesPopup(text);
                    //}
                    // });

                }
                function writecanvesPopup(text) {

                    jQuery("body").append('<style>.karmora-login {display: inline-block;float: right;width: 170px;font-size: 14px;height: 34px;margin: 0px 0px 0px 10px;cursor: pointer;}.ebates-notification-close {display: inline-block;float: right;width: 24px;height: 24px;}.ebates-notification-logo {display: inline-block;width: 103px;height: 42px;margin: 8px;}.ebates-notification-container {margin: 0px 10px;line-height: 16px;min-width: 400px;box-sizing: content-box;vertical-align: top;border: 1px solid rgb(170, 170, 170);border-image-source: initial;border-image-slice: initial;border-image-width: initial;border-image-outset: initial;border-image-repeat: initial;border-radius: 5px;padding: 7px 5px 3px;display: inline-block;background: rgb(255, 255, 255);box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 2px;height: 42px;}div.ebates-notification {top: 0px;height: 66px;min-width: 880px;background: rgb(43, 128, 1);float: none;position: fixed;left: 0px;right: 0px;padding: 0px;margin: 0px;overflow: hidden;z-index: 999999999;cursor: default;-webkit-user-select: none;font-size: 14px;line-height: 16px;display: inline-block;box-sizing: content-box;}</style><div class="ebates-notification" id="notification" style="height: 66px; display: inline-block; top: 0px;"><div style="padding: 5px; float: none; text-align: left;"><div class="ebates-notification-close" id=""><a href="#" onclick="document.getElementById(\'notification\').style.display=\'none\'"><img src="https://staging.karmora.com/public/images/close.png"></a></div><div class="ebates-notification-logo"><img src="https://www.karmora.com/logo48.png"></div><span class="ebates-notification-container"><div class="karmora-login" title="">' + text + '</div><div class="ebates-notification-link">Get <span class="ebates-notification-cashback">' + amount + '</span></div><div class="ebates-notification-store">at ' + storeName + '</div></span></div></div>');
                }

            }
        }).get();
    }
}    
});

Answer 1

这是因为您是在浏览器上下文中调用 jQuery，而不是在 DOM 上下文中。您无法在浏览器上下文中操作页面。看看可以操作 DOM 的Content Scripts。

查看实际操作：https://gist.github.com/AdrianArroyoCalle/f8535807ebd738e938b7