Go Restful API：CORS 配置适用于 React，但不适用于 Angular

有志者，事竟成！如果你在学习Golang，那么本文《Go Restful API：CORS 配置适用于 React，但不适用于 Angular》，就很适合你！文章讲解的知识点主要包括，若是你对本文感兴趣，或者是想搞懂其中某个知识点，就请你继续往下看吧~

我希望你一切都好。 拜托，我使用 go 和 gorilla/mux 和 rs/cors 构建了这个 restful api。 这是设置了 cors 的路由器处理程序

func newrouter() *mux.router {

    r := mux.newrouter().strictslash(true)
    r.handlefunc("/healthz", func(w http.responsewriter, r *http.request) {
        w.header().set("content-type", "application/json; charset=utf-8")
        w.writeheader(http.statusok)
        json.newencoder(w).encode("i'm alive")
    })
    r.handlefunc("/api/analysis/{projectid}", list).methods(http.methodget, http.methodoptions)      // list all charts
    r.handlefunc("/api/analysis/{projectid}", create).methods(http.methodpost, http.methodoptions)   // create a chart
    r.handlefunc("/api/analysis/{projectid}", delete).methods(http.methoddelete, http.methodoptions) // delete a chart

    return r
}

这是我启动服务器的方式

r := NewRouter()

    r.Use(loggingMiddleware)
    handler := cors.Default().Handler(r)
    log.Fatal(http.ListenAndServe(":5000", handler))

cors 来自 https://github.com/rs/cors

从 angular web 应用程序中，我调用路由 http://localhost:5000/api/analysis/6023d34440baf5016e5b74ea 但收到 cors 错误：preflightmissingalloworiginheader

从 react.js web 应用程序中，我没有收到任何错误，没有错误！！请求成功

我还尝试了 mux https://github.com/gorilla/mux#handling-cors-requests 的 cors 配置，但它也不起作用。

请问我做错了什么？ 我该如何解决这个问题？

解决方案

如果您通过 start 命令运行 angular/react 应用程序（或者以任何方式运行 angular），您可能需要为 cors 允许的起源标头指定这些应用程序运行位置的完整 url（例如 localhost:9999）。

还有另外两点：

1. 从路由上的 methods 部分中删除 http.methodoptions - 每当检测到选项 http 方法时，cors 处理程序都会处理它。我认为这些端点不会被触发（因为 cors 处理程序应该拦截它们），但其中包含 http.methodoptions 会产生误导。
2. 您要创建两个路由器吗？首先使用 r:= mux.newrouter() ，然后再次使用 r:= newrouter() - 或者这只是复制/粘贴的混合？

这可以对 rs/cors 包完成，如下所示：

r := mux.newrouter().strictslash(true)
r.handlefunc("/api/analysis/{projectid}", list).methods(http.methodget)
// ... add other routes here

// then wrap in the cors handler
corshandler := cors.new(cors.options{
        allowedorigins: []string{"http://localhost", "http://localhost:4200", "http://localhost:9999"},
        allowedheaders: []string{"*"},
    }).handler(r)

// now serve the api
http.listenandserve(":5000", corshandler)

如果您需要 cookie：

r := mux.NewRouter().StrictSlash(true)
r.HandleFunc("/api/analysis/{projectId}", List).Methods(http.MethodGet)
// ... add other routes here

// Then wrap in the CORS handler
corsHandler := cors.New(cors.Options{
        AllowedOrigins: []string{"http://localhost", "http://localhost:4200", "HTTP://localhost:9999"},
        AllowedHeaders: []string{"*"},
        AllowCredentials: true,
    }).Handler(r)

// Now serve the API
http.ListenAndServe(":5000", corsHandler)

终于介绍完啦！小伙伴们，这篇关于《Go Restful API：CORS 配置适用于 React，但不适用于 Angular》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~golang学习网公众号也会发布Golang相关知识，快来关注吧！