Firefox addon 扩展和内容javascript文件之间的双向通信_Firefox Addon

Firefox addon 扩展和内容javascript文件之间的双向通信

firefox-addon

Firefox addon 扩展和内容javascript文件之间的双向通信,firefox-addon,Firefox Addon,我试图在我的firefox侧边栏扩展中完成双向通信请求响应，我有一个名为event.js的文件，它位于内容端，我还有一个名为sidebar.js的文件，它位于xul中。我能够使用dispatchEvent方法从event.js到sidebar.js文件进行通信。我的事件反过来在sidebar.js文件中引发一个XMLHttpRequest，该文件将命中服务器并发送回响应。现在，我无法将响应传递到event.js文件。我希望在event.js文件中访问响应。到目前为止，我只实现了单向沟通。请帮我取

我试图在我的firefox侧边栏扩展中完成双向通信请求响应，我有一个名为event.js的文件，它位于内容端，我还有一个名为sidebar.js的文件，它位于xul中。我能够使用dispatchEvent方法从event.js到sidebar.js文件进行通信。我的事件反过来在sidebar.js文件中引发一个XMLHttpRequest，该文件将命中服务器并发送回响应。现在，我无法将响应传递到event.js文件。我希望在event.js文件中访问响应。到目前为止，我只实现了单向沟通。请帮我取得双向沟通

代码如下：

// event.js file
// This event occurs on blur of the text box where i need to save the text into the server

function saveEvent() {

 var element = document.getElementById("fetchData");
            element.setAttribute("urlPath", "http://localhost:8080/event?Id=12");
            element.setAttribute("jsonObj", convertToList);
            element.setAttribute("methodType", "POST");
            document.documentElement.appendChild(element);

            var evt = document.createEvent("Events");
            evt.initEvent("saveEvent", true, true);
            element.dispatchEvent(evt);

//Fetching the response over here by adding the listener
document.addEventListener("dispatchedResponse", function (e) { MyExtension.responseListener(e); }, false, true);

}

var MyExtension = {
    responseListener: function (evt) {
        receivedResponse(evt.target.getAttribute("responseObject"));
    }
}

function receivedResponse(event) {
    alert('response: ' + event);
}


// sidebar.js file

window.addEventListener("load", function (event) {

 var saveAjaxRequest = function (urlPath, jsonObj, methodType, evtTarget) {

        var url = urlPath;
        var request = Components.classes["@mozilla.org/xmlextras/xmlhttprequest;1"].createInstance(Components.interfaces.nsIXMLHttpRequest);
        request.onload = function (aEvent) {
            window.alert("Response Text: " + aEvent.target.responseText);
            saveResponse = aEvent.target.responseText;

            //here i am again trying to dispatch the response i got from the server back to the origin, but unable to pass it...

            evtTarget.setAttribute("responseObject", saveResponse);
            document.documentElement.appendChild(evtTarget);

            var evt = document.createEvent("dispatchedRes"); // Error line "Operation is not supported" code: "9"
            evt.initEvent("dispatchedResponse", true, false);
            evtTarget.dispatchEvent(evt);
        };
        request.onerror = function (aEvent) {
            window.alert("Error Status: " + aEvent.target.status);
        };
        //window.alert(methodType + " " + url);
        request.open(methodType, url, true);
        request.send(jsonObj);
    };


this.onLoad = function () {

document.addEventListener("saveEvent", function (e) { MyExtension.saveListener(e); }, false, true);


}


var MyExtension =
        {
            saveListener: function (evt) {
                saveAjaxRequest(evt.target.getAttribute("urlPath"), evt.target.getAttribute("jsonObj"), evt.target.getAttribute("methodType"), evt.originalTarget);
            }
        };


});

为什么要将fetchData元素移动到侧边栏文档中？您应该将其留在原处，否则您的内容代码将无法接收事件。另外，使用内容文档创建事件。最后，自定义事件的document.createEvent参数应该是events。因此，您//此处我再次尝试注释后的代码应该如下所示：

evtTarget.setAttribute("responseObject", saveResponse);

var evt = evtTarget.ownerDocument.createEvent("Events");
evt.initEvent("dispatchedResponse", true, false);
evtTarget.dispatchEvent(evt);

但是请注意，您在这里展示的代码是一个巨大的安全漏洞-它允许任何网站发出任何HTTP请求并返回结果，因此本质上是禁用的。至少你需要检查与你交谈的网站是否被允许这样做，例如，它属于你的服务器。但即使这样，它仍然存在安全风险，因为服务器响应可能会被更改，例如，被公共WLAN上的攻击者更改，或者您的服务器可能被黑客入侵，您将允许攻击者访问敏感数据，例如，他可能触发对mail.google.com的请求，如果受害者碰巧登录，他将能够读取所有电子邮件数据因此，请减少这种通用性，只允许对某些网站的请求。

evtTarget.setAttribute("responseObject", saveResponse);

var evt = evtTarget.ownerDocument.createEvent("Events");
evt.initEvent("dispatchedResponse", true, false);
evtTarget.dispatchEvent(evt);