用于HTTPS设置的本地Vue.js应用的HMR显示跨域请求被阻止

Question

1。我的球童版本（caddy -version）：

v2.0.0-beta.13 h1:QL0JAepFvLVtOatABqniuDRQ4HmtvWuuSWZW24qVVtk=

2。我如何运行球童：

一种。系统环境：

我正在macOS Mojave - 10.14.6上使用Caddy服务器静态二进制文件，并在caddy中将二进制文件作为$PATH命令使用。

b。命令：

caddy

d。我完整的Caddyfile：

backend.cdy.test {
  tls ./_wildcard.cdy.test.pem ./_wildcard.cdy.test-key.pem

  reverse_proxy localhost:3000 {
    header_up Host {host}
    header_up Origin {host}
    header_up X-Real-IP {remote}
    header_up X-Forwarded-Host {host}
    header_up X-Forwarded-Server {host}
    header_up X-Forwarded-Port {port}
    header_up X-Forwarded-For {remote}
    header_up X-Forwarded-Proto {scheme}

    header_down Access-Control-Allow-Origin https://frontend.cdy.test
  }

}

frontend.cdy.test {
  tls ./_wildcard.cdy.test.pem ./_wildcard.cdy.test-key.pem

  reverse_proxy localhost:8080 {
    header_up Host "localhost"
    header_up X-Real-IP {remote}
    header_up X-Forwarded-Host "localhost"
    header_up X-Forwarded-Server "localhost"
    header_up X-Forwarded-Port {port}
    header_up X-Forwarded-For {remote}
    header_up X-Forwarded-Proto {scheme}
  }
}

3。我遇到的问题：

[这是我第一次尝试将caddy服务器设置为运行两个应用，每个应用将通过HTTPS在主域的子域下运行。其中一个是基于express.js的后端，另一个是基于Vue.js的前端。

似乎到目前为止一切正常，但是由Vue.js构建的Sockets and Hot Module Replacement在开发过程中无法正常运行。

4。错误消息和/或完整的日志输出：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://192.168.5.10:8080/sockjs-node/info?t=1888826474028. (Reason: CORS request did not succeed).
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://localhost/sockjs-node/info?t=4740717588882. (Reason: CORS request did not succeed).

5。我已经尝试过的内容：

我没有可以分享的具体尝试，但是尝试应用带有反向代理的VueJS开发服务]中提到的内容，但是我无法使其起作用。

#localhost {
#  reverse_proxy /sockjs-node localhost {
#    header_up Host "localhost"
#    header_up Origin "localhost"
#    header_up -Access-Control-Allow-Origin
#    header_up Access-Control-Allow-Origin https://frontend.cdy.test
#    header_up Connection {>Connection}
#    header_up Upgrade {>Upgrade}
#
#    header_down Access-Control-Allow-Origin https://frontend.cdy.test
#  }
#}
[我希望有人帮助我通过caddy服务器作为HTTPS上的反向代理来完全支持此本地开发，并且如果我在该caddyfile中有任何不正确的设置，请更正我，因为我对什么没有足够的了解到目前为止已编写完毕，只是尝试应用旧指令“透明”并使设置工作与下文中提到的相同。

6。链接到相关资源：

• VueJS dev serve with reverse proxy

1。我的Caddy版本（caddy -version）：v2.0.0-beta.13 h1：QL0JAepFvLVtOatABqniuDRQ4HmtvWuuSWZW24qVVtk = 2.我如何运行Caddy：系统环境：我在macOS上使用caddy服务器静态二进制文件...

Answer 1

我想我找到了解决方法。