AJAX 调用因混合内容 HTTP/HTTPS 错误而失败，无法强制使用 HTTPS

Question

我在 ELB 后面有一个 EC2 实例运行，为此我使用 AWS Certificate Manager (ACM) 启用 HTTPS。

正如一些地方所建议的那样，我将 HTTP（端口 80）和 HTTPS (443) 映射到我的实例的 HTTP（端口 80）。

我还通过将这些行添加到 .htaccess 文件来启用强制安全连接：

RewriteEngine On
RewriteCond %{HTTPS} !=on
RewriteCond %{HTTP:X-Forwarded-Proto} ^http$
RewriteRule .* https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

所有这些都运行良好。所有页面都按预期显示安全内容，控制台中没有关于混合内容的警告。

仅在我进行 AJAX 调用的页面上，我收到有关混合内容的错误，并且仅在 Chrome 中出现。 FireFox 按预期工作，但控制台仍然显示错误。

错误（FireFox）：

Content Security Policy: Upgrading insecure request 'http://example.com/myapi/get_company/?code=abcd&limit=8' to use 'https'

错误（Chrome）：

Mixed Content: The page at 'https://example.com/mypage' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://example.com/myapi/get_company/?code=abcd&limit=8'. This request has been blocked; the content must be served over HTTPS.

我打开了 chrome://net-internals/，据我所知，有两个调用，第一个收到 HTTP 301 Permanent Redirect，第二个失败，因为重定向指向 HTTP 页面，而不是 HTTPS。

AJAX 调用如下所示：

$url = "/myapi/get_company?code=" + e;
apiJson = $.ajax({
    url: $url, 
    dataType: 'json',
    data:{
        limit:8
    },
success: function(data) { //Some code here },
error: function(jqXHR, textStatus, errorThrown) { //Some code here }
});

我也尝试提供完整的 URL 包括协议，但这并没有什么不同。

Answer 1

更新 .htaccess 配置

RewriteCond %{HTTPS} !=on --> 不需要

将 .htaccess 文件配置更新为

RewriteCond %{HTTP:X-Forwarded-Proto} !https RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301,NE]

除了更改 .htaccess 文件外，您还需要确保，一旦使用 HTTPS 方案加载页面，从该页面发出的 ajax 调用不应在 HTTP 上。您看到的错误是浏览器错误，与您的 elb 的配置方式无关。

Answer 2

我找到了解决方案，现在发布我自己问题的答案。不要问我是怎么想出来的，因为我无法给你一个明确的答案，但这就是它的作用：

$url = "/myapi/get_company?code=" + e;

更改为：

$url = "/myapi/get_company/?code=" + e;

注意尾部斜线，就在参数之前。在服务器端处理 AJAX 调用的实际文件在这里：

/myapi/get_company/index.php

Answer 3

检查问题是否在服务器上，而不是在客户端上。您的 AJAX 调用是针对 API 端点； API 端点 return 应该 return HTTPS 重定向时是 HTTP 重定向吗？

AJAX 调用因混合内容 HTTP/HTTPS 错误而失败，无法强制使用 HTTPS

AJAX calls to fail with mixed content HTTP/HTTPS errors, can't force HTTPS

ajax

amazon-web-services

ssl

amazon-ec2

amazon-elb