如何使用webpack-dev-server代理代理到ssl端点

Question

当我尝试代理此http://localhost:9000/rpc请求时,我收到:

cannot proxy to https://example.appspot.com:80 
  (write EPROTO  101057795:error:140770FC:SSL routines:
  SSL23_GET_SERVER_HELLO:unknown protocol:openssl\ssl\s23_clnt.c:794:)

webpack-dev-derver配置:

devServer: {
    contentBase: "./",
    hostname: 'localhost',
    port: 9000,
    proxy: {
        '/rpc': {
            target: 'https://example.appspot.com',
            secure: false,
            changeOrigin: true     // **Update-2 SOLVED**
        }
    }
}

我使用fetch:fetch('/rpc' ...来发出请求,Windows 10专业人员运行webpack.

没有代理:fetch('https://example.com/rpc' ...SSL请求正常.

更新.我不得不使用SSL端口443(参见Steffen的回答).
现在使用:https://example.appspot.com:443

但仍然没有合作secure: true.控制台日志显示:

cannot proxy to https://example.appspot.com:443 
(Hostname/IP doesn't match certificate's altnames: "Host: localhost. 
is not in the cert's altnames: DNS:*.appspot.com, DNS:*.thinkwithgoogle.com,
DNS:*.withgoogle.com, DNS:*.withyoutube.com, DNS:appspot.com,
DNS:thinkwithgoogle.com, DNS:withgoogle.com, DNS:withyoutube.com")

随着secure: false.控制台报告:404 (Not Found)

更新:已解决使用changeOrigin: true.文档在这里.

Answer 1

        target: 'https://example.com:80',

端口 80 不太可能用于 HTTPS。通常使用443端口

SSL23_GET_SERVER_HELLO:unknown protocol:openssl\ssl\s23_clnt.c:794:)

很可能端口 80 上的服务器没有使用 HTTPS 进行回复，而是出现了一些 HTTP 错误，因为来自客户端的消息是 TLS 握手的开始，而不是预期的 HTTP 请求。但是客户端期望回复 TLS 握手而不是 HTTP 错误。这就是您收到此错误的原因。

没有代理： fetch(' https://example.com/rpc ' ... SSL 请求工作正常。

那是因为你在这种情况下使用https://example.com而不是https://example.com:80. 因为您没有给出明确的端口，它将使用 https 的默认端口，即 443。