0

I have a React app using fetch calling to a go mux api.

I am well aware of the question here: Making golang Gorilla CORS handler work

but this does not work for me. I have tried everything in that post and still no success. Looks like go is not even running any middleware or route handler function for me.

Here is the first way I tried fixing it. This uses gorilla/handlers

package main

import (
    "fmt"
    "net/http"

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

func commonMiddleware(next http.Handler) http.Handler {
    return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
        fmt.Println("MIDDLEWARE CALLED")

        w.Header().Set("Access-Control-Allow-Origin", "*")
        w.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE")
        w.Header().Set("Access-Control-Allow-Headers", "Accept, Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization")

        next.ServeHTTP(w, r)
    })
}

func ApiHandler(w http.ResponseWriter, r *http.Request) {
    fmt.Println("ROUTE CALLED")
    fmt.Fprintf(w, `{"works:"true}`)
}

func main() {
    var router *mux.Router = mux.NewRouter()
    router.Use(commonMiddleware)

    router.HandleFunc("/api", ApiHandler).Methods("POST")

    headersOk := handlers.AllowedHeaders([]string{"Access-Control-Allow-Origin", "Accept", "Accept-Language", "Content-Type", "Content-Language", "Origin"})
    originsOk := handlers.AllowedOrigins([]string{"http://localhost:*", "*"})
    methodsOk := handlers.AllowedMethods([]string{"GET", "HEAD", "POST", "PUT", "OPTIONS"})

    http.ListenAndServe(":8000", handlers.CORS(headersOk, originsOk, methodsOk)(router))
}

This uses rs/cors

package main

import (
    "fmt"
    "net/http"

    "github.com/gorilla/mux"
    "github.com/rs/cors"
)

func commonMiddleware(next http.Handler) http.Handler {
    return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
        fmt.Println("MIDDLEWARE CALLED")
        w.Header().Set("Access-Control-Allow-Origin", "*")
        w.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE")
        w.Header().Set("Access-Control-Allow-Headers", "Accept, Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization")

        next.ServeHTTP(w, r)
    })
}

func ApiHandler(w http.ResponseWriter, r *http.Request) {
    fmt.Println("ROUTE CALLED")
    fmt.Fprintf(w, `{"works:"true}`)
}

func main() {
    var router *mux.Router = mux.NewRouter()
    router.Use(commonMiddleware)

    router.HandleFunc("/api", ApiHandler).Methods("POST")

    c := cors.New(cors.Options{
        AllowedOrigins:   []string{"*"},
        AllowCredentials: true,
    })

    handler := c.Handler(router)

    http.ListenAndServe(":8000", handler)
}

However, in both cases CORS errors still appear in the browser. I am running the react server on port 5000 and the go server is on port 8000.

 fetch("http://localhost:8000/api", {
               method: 'POST',
               headers: {
                    // "Access-Control-Allow-Origin": "*",
                    'Content-Type': 'application/json'
               },
               body: JSON.stringify({
                    example: 1
               })
          })

Error in Chrome:

Access to fetch at 'http://localhost:8000/validate/' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Neither solution works. In fact "MIDDLEWARE CALLED" and "ROUTE CALLED" in go never print out. The api works just fine in Postman so I know the router works fine and the issue really is CORS. So it appears that the route never gets called.

This is stunning, could it have something to do with preflight. How do I disable all cors issues?

0 Answers0