javascript - Chrome 扩展将数据发布到 Rails 服务器跨源 XMLHttpRequest

Question

我目前正在尝试开发一个 chrome 扩展程序，它可以从 https 网页检索文本到我的服务器，它只处理 http。我调查了this tutorial还有这个question .

从这些中，我推断出为了让跨源 xhr 工作，我需要

1. 设置 list 权限以包含我要定位的 url

为此，我的权限如下所示:

"permissions": [
    "tabs", "<all_urls>"
]

我输入了特定的 url，但在打包我的并将我的更改为“< all_urls >”后不得不将其删除。

1. 为指定的 url 创建一个 XMLHttpRequest

为此，我的代码摘录如下所示:

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
   if (xhr.readyState == 4 && xhr.status == 200) {
        document.getElementById("response").innerText = xhr.responseText;
        console.log(xhr.responseText);
   }
};
xhr.open("POST", MY_SERVER_URL, true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(message.toString());

MY_SERVER_URL 是我反复检查过的有效网址，但出于多种原因我无法在这个问题中指定 ;(

message 是一个数组，其中包含我要发送到服务器的一系列不同消息。

1. 打包我的扩展代码并安装

在 packaging guide 之后从谷歌，我将我的文件夹打包成一个 .crx 文件并将其拖放到我的 chrome://extensions 页面进行安装。

1. 在我的服务器上，安装了 rack cors gem。

我在服务器的 Gemfile 中有以下行:

gem 'rack-cors', :require => 'rack/cors'

但是，当我尝试向我的服务器发送数据时，仍然收到以下错误消息

Mixed Content: The page at MESSAGE_PARSING_URL was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint MY_SERVER_URL. This request has been blocked; the content must be served over HTTPS.

我做错了什么？我真的很感激任何帮助。谢谢:D

Answer 1

如果您从安全页面 (https) 的内容脚本发出不安全 (http) 请求，则会出现混合内容错误。
您有 3 个选项来解决问题:

1. 从内容脚本向您的服务器发出安全请求
2. 仍然使用不安全的请求，但它们来自后台脚本。并使用 message passing 将结果传递给您的内容脚本
3. 使用 --allow-running-insecure-content 标志启动 chrome。但这不是一个实用的解决方案，仅对开发有用(当您的暂存位于 http 上时)。