1

我正在将 chrome 扩展移植到 Firefox,并希望保留尽可能多的代码。我正在使用 sdk,而且我是 JavaScript 新手,所以如果这只是一个小错误,请多多包涵;)

我需要通过内容脚本中的几个 XMLHttpRequest 获取一些东西。

做事的“firefox 方式”是使用 sdk-request-api 并通过 main- 和 content-script 之间的消息像这样工作。除了在整个插件中实现这一点对我来说意味着很多工作之外,我还需要获取二进制数据,这似乎是不可能的。

此处记录了此问题的解决方法。我宁愿避免这种情况,因为我想我在某处读到它现在是一个测试版功能,而且它似乎很“变通”。

理想情况下,我想以这种方式实现它。在即将到来的 Firefox 24 中,应该可以允许内容脚本访问某些域。因此,我现在正在使用 Firefox Aurora。我将以下代码添加到我的package.json中:

"permissions": {
      "cross-domain-content": ["http://mozilla.org"]
 }

当单击按钮并将脚本加载到其中时,我的main.js会创建一个面板:

var testPanel = require("sdk/panel").Panel({
                contentURL: data.url("pages/background.html"),
                contentScriptFile:   [data.url("util/jquery-1.8.2.min.js"), data.url("pages/xhrTest.js")]
            })
testPanel.show();

这是我的xhrTest.js

var xhr = new XMLHttpRequest();
xhr.open("GET","http://mozilla.org",true);
xhr.onerror = function () {
   console.log("Error");
};
xhr.onload = function () {
   console.log("loaded");
}

xhr.send();

调试时,它从状态 2 跳转到状态 4,响应为空,并调用“onerror”。状态为 0,statustext 为空,我没有看到任何其他指示出了什么问题。现在我不知道这是否仍然是同源策略阻止我,还是我做错了什么?

我真的很感激我能得到的任何帮助:)

在此先感谢,
法比

4

1 回答 1

2

嗯,我真的看不出有明显的错误。这是一个基于有效文档的示例插件,至少它在 Firefox 24 Beta 中对我有用

主.js:

// main.js
var data = require("sdk/self").data;

var panel = require("sdk/panel").Panel({
  height: 250,
  contentURL: data.url("panel.html"),
  contentScriptFile: data.url("panel-script.js")
});

panel.on("show", function(){
  panel.port.emit("show");
});

require("sdk/widget").Widget({
  id: "test-widget",
  label: "Test-Widget",
  contentURL: "http://www.mozilla.org/favicon.ico",
  panel: panel
});

面板.html:

<!doctype HTML>
<html>
<meta charset="utf-8">
  <head></head>
  <body>
    <pre id="forecast_summary"></pre>
  </body>
</html>

内容脚本:

// panel-script.js
var url = "https://hn-test.firebaseio.com/articles/e5b10c82600b51732af584583a7f57c4a7c01bff.json";

self.port.on("show", function () {
  var request = new XMLHttpRequest();
  request.open("GET", url, true);
  request.onload = function () {
    var element = document.getElementById("forecast_summary");
    // formatting
    var pretty = JSON.stringify(JSON.parse(request.responseText), null, '  ');
    element.textContent = pretty;
  };
  request.send();
});

包.json:

{
  "name": "jp-crossdomain-xhr",
  "fullName": "jp-crossdomain-xhr",
  "id": "jid1-B2RaQxOBKox8wA",
  "description": "a basic add-on",
  "author": "",
  "license": "MPL 2.0",
  "version": "0.1",
  "permissions": {
    "cross-domain-content": ["https://hn-test.firebaseio.com"]
  }
}

Github 回购

于 2013-08-13T05:11:58.077 回答