9

我在 Google Chrome 扩展的 background_script 中有以下代码：

var source = new EventSource("http://www.janywer.freetzi.com/events/groupshout.php");
source.addEventListener('message', function (e) {
    console.log('message', e.data);
}, false);
source.addEventListener('open', function (e) {
    console.log('open');
}, false);
source.addEventListener('error', function (e) {
    console.log('error')
}, false);

我的问题如下：每当我加载扩展程序时，它都会显示“错误”，但我如何找出究竟是什么触发了错误？

4

1 回答 1

9

规范只定义了触发“错误”事件的几种可能情况，它们是：

  • 已启动跨域请求，但未收到预期的 CORS 标头。这包括：
    • Access-Control-Allow-Origin未设置或与原始 URL 不匹配。
    • 您已经设置withCredentials:true（通过 的第二个参数EventSource），但服务器没有回复Access-Control-Allow-Credentials: true.
  • 发生网络错误。
  • http 状态不是 200、305、401、407、301、302、303 或 307。
  • 用户代理（浏览器）正在尝试重新建立连接。
  • http 状态为 200，但Content-Type响应的标头不是 `text/event-stream.
  • 发生了重定向，这导致了先前的条件之一。

当发生 CORS 错误时，Chrome 通常会将以下消息记录到控制台：

EventSource 无法加载http://example.com/eventsource。Access-Control-Allow-Origin 不允许来源http://origin.example.com 。

出于某种原因，当发生重定向时，Chrome 不会显示此错误。

您可能已将"http://www.janywer.freetzi.com/*"权限添加到清单文件，导致初始请求通过。此页面重定向到不同的域（没有 www 前缀）。您可能尚未将此域添加到清单文件中，因此 Chrome 会尝试启用 CORS 的请求。未收到预期的标头，因此 Chrome 中止了请求。

这可以通过两种方式解决：

  • 将所有涉及的域添加到您的 文件中，例如

    "permissions": [
    "http://www.janywer.freetzi.com/*",
    "http://janywer.freetzi.com/*"
]

    （请参阅Chrome 扩展文档中的匹配模式）

  • 或者让服务器回复预期的 CORS 标头。在 PHP 中：

    header("Access-Control-Allow-Origin: *");

    这允许任何页面访问您的 URL。要仅限制对您的扩展程序的访问，请使用：

    header("Access-Control-Allow-Origin: chrome-extension://EXTENSION ID HERE");
于 2013-06-23T19:19:27.363 回答