Apache 反向代理和本地主机 - "Mixed content, the content must be served over HTTPS"

Question

我已经为在本地主机上运行的节点服务器创建了一个反向代理，以便它可以通过 HTTPS 提供服务。

转发工作很顺利，但是当应用程序尝试发出请求时，我得到：

Mixed Content: The page at 'https://foo.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://localhost:8888/graphql?query=%7Bnotifications(userid)%7Bid%2C… This request has been blocked; the content must be served over HTTPS.

虚拟主机配置：

<VirtualHost *:443>
   ServerName www.foo.com
   ServerAlias foo.com
   DocumentRoot /var/www/foo/
   ErrorLog /var/www/foo/error.log
   CustomLog /var/www/foo/requests.log combined

   SSLEngine on
   SSLProtocol all -SSLv2
   SSLCipherSuite HIGH:MEDIUM:!aNULL:!MD5
   SSLCertificateFile "/etc/letsencrypt/live/foo.com/cert.pem"
   SSLCertificateKeyFile "/etc/letsencrypt/live/foo.com/privkey.pem"

   ProxyPreserveHost On
   ProxyRequests Off
   ProxyPass / http://localhost:8888/
   ProxyPassReverse / http://localhost:8888/

</VirtualHost>

我的设置中缺少什么？

Answer 1

您需要将 SSL 证书添加到您的 node.js 应用程序。在 apache 上启用它不会有帮助，因为 apache 正在将请求转发到端口 8888 上的 node.js 应用程序（它通过纯 http 而不是 https 进行通信）。这就是为什么您会收到混合内容错误的原因。初始请求在 apache 上的 https 然后转发到 http 到 node.js

使用 SSL 证书配置 node.js 应用程序的步骤（您可以使用自签名证书或商业证书）。

首先你必须使用ssl-root-cas available via npm。配置如下：

'use strict';

var https = require('https')
  , cas
  ;

// This will add the well-known CAs
// to `https.globalAgent.options.ca`
require('ssl-root-cas').inject();

cas = https.globalAgent.options.ca;

cas.push(fs.readFileSync(path.join(__dirname, 'ssl', '01-ssl-intermediary-a.pem')));
cas.push(fs.readFileSync(path.join(__dirname, 'ssl', '02-ssl-intermediary-b.pem')));
cas.push(fs.readFileSync(path.join(__dirname, 'ssl', '03-ssl-site.pem')));

试试看是否有效！

Answer 2

您正在 https://foo.com/ 上打开页面，但页面中的 URL 包含硬编码的 localhost 域和端口。在呈现页面时，客户端浏览器将尝试获取 'http://localhost:8888/graphql 有效地跳过 apache（在端口 80 上运行ning，在服务器 foo.com 上）并直接点击您的节点应用程序，这将 1 ) 仅当您运行浏览器来自与您的节点应用运行ning 相同的机器时，并且 2) 即使那样，您也会收到上述错误，因为某些页面资产是使用 http.

当您使用相对 URL 时（例如 URL 以 / 开头），浏览器将在基数 URL 前面加上 https://foo.com/graphql ].

Absolute vs relative URLs

Apache 反向代理和本地主机 - "Mixed content, the content must be served over HTTPS"

Apache Reverse Proxy and localhost - "Mixed content, the content must be served over HTTPS"

apache

proxy

reverse-proxy

node.js

express