通过 https 的 webpack 开发服务器代理答案

【问题标题】：webpack dev-server proxy over https通过 https 的 webpack 开发服务器代理
【发布时间】：2018-07-02 20:31:47
【问题描述】：

我很难让我的 webpack 开发服务器代理到我的后端。

我正在使用 Vue 和 webpack cli 模板。

我的后端托管在 docker 容器中，可以在 localhost:8443/foo 看到

我的 devServer 配置设置为：

dev: {
  proxyTable: {
    '/foo': {
       target: 'https://0.0.0.0:8443',
       secure: false,
       changeOrigin: true,
  },
  host: '0.0.0.0',
  port: 9000,
  https: {
    pfx: /path/to/pfx/file,
    passphrase: 'password',
    ca: /path/to/ca/file,
  }

就像我之前说的，当我将浏览器指向 https://localhost:8443/foo 时，我可以访问我的 api

当我运行我的 webpack 服务器并尝试访问 https://localhost:9000/foo 时，我收到错误消息：

Error occurred while trying to proxy request /foo from localhost:9000 to https://0.0.0.0:8334 (EPROTO)

我看不出我做错了什么，我的后端也没有关于连接的错误。我认为我的代理甚至没有连接。

我在 web 服务器上运行的 docker 命令是：

docker run -d --env-file=service.env -v /path/to/certs:/docker/path/certs -v /path/for/logs:/docker/path/logs -p 8443:8443

webpack 开发服务器未在 docker 实例中运行。

【问题讨论】：

你的 Docker Run 命令是什么样的？你有开放的端口让流量通过吗？您还在 docker 容器中运行您的 vue 开发服务器吗？
我已经用这些信息更新了问题

标签： proxy webpack-dev-server

【解决方案1】：

解决了我自己的问题。

我必须分解目标密钥并向其添加 SSL 标记。

我没有将服务器凭据传递给 https 标记，而是在目标标记中完成。

【讨论】：