在 Gorilla Mux 中配置 CORS：POST 请求出现 403 错误答案

【问题标题】：config CORS in Gorilla Mux: 403 error on POST request在 Gorilla Mux 中配置 CORS：POST 请求出现 403 错误
【发布时间】：2018-02-08 11:40:49
【问题描述】：

我有一个 API，目前正在尝试使用它的一个端点。端点用于 POST 请求，端点按预期工作。该 API 在云中运行，我使用 curl 对其进行了测试，它非常完美，然后从我的 react 应用程序中我试图使用它，但我得到了 403 status code。

在浏览器的控制台中查看时，我发现我在 OPTIONS 请求中收到该错误，并且 POST 永远不会完成。下面是控制台中显示的结果截图：

然后，我用一个表单制作了一个简单的 HTML 文件，在那里我放置了所需的输入，以及指向这个端点的动作，它工作得很好。然后，我不知道错误在哪里？我在 API 中启用了 CORS

在我使用 Gorilla/mux 的 API 中，我有这样的东西：

// Set up a router and some routes
    r := mux.NewRouter()
    r.HandleFunc("/", handleHome)
    //some other routes

    headersOk := handlers.AllowedHeaders([]string{"*"})
    originsOk := handlers.AllowedOrigins([]string{"*"})
    methodsOk := handlers.AllowedMethods([]string{"GET", "HEAD", "POST", "PUT", "OPTIONS"})

    // Start http server
    port := fmt.Sprintf(":%d", SomePort)
    http.ListenAndServe(port, handlers.CORS(originsOk, headersOk, methodsOk)(r))

使用：

"github.com/gorilla/mux"
"github.com/gorilla/handlers"

我在浏览器中收到的消息是（西班牙语）：

Solicitud desde otro origen bloqueada: la politica de mismo origen impide leer el recurso remoto en https://miURL (razón: falta la cabecera CORS 'Access-Control-Allow-Origin'）。

英文：基本上服务器拒绝请求，因为 CORS 标头不存在。

那么，我在路由器配置中做错了什么？

【问题讨论】：

这与 reactjs 无关，但通常与 ajax 和您的 api 无关。您要发送哪些请求标头？如果您发送除fetch.spec.whatwg.org/#cors-safelisted-request-header 中列出的标头之外的任何标头，则会导致它对请求进行预检，并且您的 api 在 OPTIONS 请求上发送 403。检查您的 API。
@cowbert 正确！这是唯一正在发送的标头
正如 cmets 在 stackoverflow.com/questions/45967591/config-cors-in-gorilla-mux 中所指出的，您的请求似乎正在添加一个“osn”请求标头，同时添加了一个绝对不需要的 Access-Control-Allow-Origin添加—&这就是触发浏览器执行预检选项的原因。正如另一个问题的 cmets 中所提到的，问题在于您的服务器对您发送请求的任何 URL 的 403 选项请求响应。因此，您需要将后端配置为不需要对该路由的 OPTIONS 请求进行身份验证

标签： reactjs post go http-post gorilla

【解决方案1】：

使用rs/cors，您应该可以轻松解决 CORS 问题。

在您的 server.go

上

package main

import (
    . . .       
    "fmt"
    "log"
    "net/http"
    "github.com/gorilla/mux"
    "github.com/rs/cors"
    "../myhandler"
)

func main() {

fmt.Println("Settin up server, enabling CORS . . .")

  c := cors.New(cors.Options{
      AllowedOrigins: []string{"*"}, // All origins
      AllowedMethods: []string{"GET"}, // Allowing only get, just an example
  })

  router := mux.NewRouter()
  // Example handler
  router.HandleFunc("/test", myhandler.TestHandler())
  http.Handle("/", router)

  // Bind to port 8000 and pass our router in and pass the cors Handler
  log.Fatal(http.ListenAndServe(":8000"), c.Handler(router)))

  fmt.Println("Server is ready and is listening at port :8000 . . .")

}

在你的 testhandler.go 上，假设你想接受Content-Type: application/json

. . .

func TestHandler func(w http.ResponseWriter, r *http.Request) {
    w.Header().Set("Content-Type", "application/json")
    w.WriteHeader(http.StatusOK)
    return
}

【讨论】：