擴展和內容JavaScript文件之間的雙向通信

我想在我的firefox側邊欄擴展中完成雙向通信請求響應，我有一個名爲event.js的文件駐留在內容端，我有另一個文件稱爲側邊欄.js文件駐留在xul中。我能夠使用dispatchEvent方法從event.js到sidebar.js文件進行通信。我的事件反過來在sidebar.js文件中引發一個XMLHttpRequest，該文件命中服務器併發迴響應。現在，在這裏我無法將響應傳遞給event.js文件。我想要在event.js文件中訪問響應。直到現在，我只能實現單向溝通。請幫助我獲得雙向溝通。擴展和內容JavaScript文件之間的雙向通信

代碼如下：

// 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); 
      } 
     }; 


});

來源

2011-06-28 user819066

你爲什麼你fetchData單元移動到側邊欄的文件？您應該將其保留在原處，否則您的內容代碼將無法接收該事件。另外，使用內容文檔創建事件。最後，自定義事件的document.createEvent()參數應爲"Events"。所以，你的//here i am again trying評論後的代碼應該是這樣的：

evtTarget.setAttribute("responseObject", saveResponse); 

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

不過請注意，您的代碼，你看它這裏是一個巨大的安全漏洞 - 它允許任何網站，使任何 HTTP請求，並得到結果回來，所以它實質上禁用same-origin policy。至少您需要檢查與您通話的網站是否允許這樣做（例如，它屬於您的服務器）。但即使如此，它仍然存在安全風險，因爲服務器響應可能會發生變化（例如，公共WLAN上的攻擊者）或者您的服務器可能遭到黑客攻擊 - 並且您會讓攻擊者訪問敏感數據（例如，他可能觸發請求mail.google.com，如果受害者恰好登錄，他將能夠閱讀所有電子郵件數據）。所以請讓這個不那麼通用，只允許請求一些網站。

來源

2011-07-01 15:34:14

擴展和內容JavaScript文件之間的雙向通信

回答

相關問題