尽管为 Nginx、angular-http-server 和 Golang 启用了

Question

我已经在开发中成功启用了 CORS。我的 Golang 后端与本地计算机上的 Angular 前端通信良好。但是，我不知道如何在生产环境中启用 CORS（DigitalOcean 上的 Ubuntu）。我在 Firefox 上得到这个：

“跨源请求被阻止：同源策略不允许读取位于http://localhost:12345/anteroom 的远程资源。（原因：CORS 请求未成功）。”

我正在使用 systemd 单元运行 Golang 后端，并在 localhost:12345 提供服务。

我使用 PM2 和 angular-http-server 将 Angular 前端作为构建（使用--prod标志构建）运行，并通过端口 8080 提供服务。此端口位于防火墙后面。我使用 Nginx 来处理这个前端的 HTTPS 流量。它在端口 80 上侦听并proxy_pass在端口 8080 上将 ( ) 请求传递给它。登陆页面（只需要一个 GET 请求）在浏览器中加载正常，所以这个设置似乎是可行的。

我正在使用的版本：Ubuntu 16.04、PM2 3.3.1、Angular CLI 7.3.4、angular-http-server 1.8.1。

当前端尝试将 JSON 数据 POST 到后端（localhost:12345/anteroom，如上面的消息所示）时，就会出现问题。

我读过 CORS 是服务器端问题。因此，我尝试在有服务器的任何地方启用它，即在后端、Nginx 和 angular-http-server 中启用它。

它在我的 Golang 代码中启用：

func anteroom(res http.ResponseWriter, req *http.Request) {

    res.Header().Set("Access-Control-Allow-Origin", "*")

    res.Header().Set("Access-Control-Allow-Methods", "POST, OPTIONS")

    res.Header().Set("Access-Control-Allow-Headers", "Content-Type")

    res.Header().Set("Content-Type", "application/json")

...

}

func main() {

    ...

    # Using Gorilla mux router.

    router := mux.NewRouter()

    router.HandleFunc("/anteroom", anteroom).Methods("POST", "OPTIONS")

}

这成功地在开发中启用了 CORS，其中服务 Golang 只是打开其构建的二进制文件，而 Angular 使用ng serve.

以上在生产中是不够的。所以，我尝试使用 angular-http-server 启用它。注意--cors最后的标志：

pm2 start $(which angular-http-server) --name app -- --path /PATH/TO/DIST -p 8080 --cors

我还尝试在与 Angular 前端构建相关的 Nginx 文件中启用它（改编自此处）：

location / {

if ($request_method = 'OPTIONS') {

        add_header 'Access-Control-Allow-Origin' '*';

        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';

        add_header 'Access-Control-Allow-Headers' 'Content-Type';

        add_header 'Content-Type' 'application/json';

        return 204;

}

}

我查看了 PM2、angular-http-server、Nginx 和其他一些东西的文档，但我不知道我遗漏了什么。让我知道？谢谢。

Answer 1

我使用 tcpdump 查看来回的标头。长话短说，在某些时候它让我意识到我将前端设置为与“本地主机”通信。显然，这意味着使用前端的任何客户端浏览器都将在其自己的本地计算机上查找它。为了解决这个问题，我为我的角度前端设置了单独的应用程序环境。这允许前端在暂存中与本地主机通信，在生产中与我的后端域通信。

Answer 2

    func anteroom(res http.ResponseWriter, req *http.Request) {    res.Header().Set("Access-Control-Allow-Origin", "*")    res.Header().Set("Access-Control-Allow-Methods", "POST, OPTIONS")    res.Header().Set("Access-Control-Allow-Headers", "Content-Type")    res.Header().Set("Content-Type", "application/json")...}func main() {    ...    # Using Gorilla mux router.    router := mux.NewRouter()    router.HandleFunc("/anteroom", anteroom).Methods("POST", "OPTIONS")}代码中缺少 GET 方法。将此行更改 res.Header().Set("Access-Control-Allow-Methods", "POST, OPTIONS")为res.Header().Set("Access-Control-Allow-Methods", "GET, POST, OPTIONS")