


Golang application: 'Access-Control-Allow-Origin' header does not exist on the requested resource
Whenever I try to send an HTTP request from an Angular application to a Go server, I receive the following response:
The response to the preflight request failed the access control check: The 'Access-Control-Allow-Origin' header is not present on the requested resource.
I added the headers detailed in the error response, but the error persists.
server.go
package rest import ( "context" "fmt" "net/http" "os" "os/signal" "sync" "syscall" "github.com/gorilla/mux" "github.com/randyVerduguez/randy-verduguez_06122023-BE-challenge/configs" "github.com/randyVerduguez/randy-verduguez_06122023-BE-challenge/http/rest/handlers" "github.com/randyVerduguez/randy-verduguez_06122023-BE-challenge/pkg/db" "github.com/rs/cors" "github.com/sirupsen/logrus" ) type Server struct { logger *logrus.Logger router *mux.Router config configs.Config } func NewServer() (*Server, error) { config, err := configs.NewParsedConfig() if err != nil { return nil, err } database, err := db.Connect(db.ConfigDB{ Host: config.Database.Host, Port: config.Database.Port, User: config.Database.User, Password: config.Database.Password, Name: config.Database.Name, }) if err != nil { return nil, err } log, err := NewLogger() if err != nil { return nil, err } router := mux.NewRouter() handlers.Register(router, log, database) server := Server{ logger: log, config: config, router: router, } return &server, nil } func (s *Server) Run(ctx context.Context) error { cors := cors.New(cors.Options{ AllowedMethods: []string{"GET, POST"}, AllowedOrigins: []string{"http://localhost:4200"}, AllowedHeaders: []string{"Content-Type", "Accept"}, }) server := http.Server{ Addr: fmt.Sprintf(":%d", s.config.ServerPort), Handler: cors.Handler(s.router), } stopServer := make(chan os.Signal, 1) signal.Notify(stopServer, syscall.SIGINT, syscall.SIGTERM) defer signal.Stop(stopServer) serverErrors := make(chan error, 1) var wg sync.WaitGroup wg.Add(1) go func(wg *sync.WaitGroup) { defer wg.Done() s.logger.Printf("REST API listening on %d", s.config.ServerPort) serverErrors <- server.ListenAndServe() }(&wg) select { case err := <-serverErrors: return fmt.Errorf("error: starting REST API server %w", err) case <-stopServer: s.logger.Warn("server recieved STOP signal") err := server.Shutdown(ctx) if err != nil { return fmt.Errorf("graceful shutdown did not complete: %w", err) } wg.Wait() s.logger.Info("server was shutdown gracefully") } return nil } func (s *Server) ServeHTTP(w http.ResponseWriter, r *http.Request) { w.Header().Set("Access-Control-Allow-Origin", "http://localhost:4200") w.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS") w.Header().Set("Access-Control-Allow-Credentials", "true") w.Header().Set("Access-Control-Allow-Headers", "Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization, Accept, origin, Cache-Control, X-Requested-With") if r.Method == "OPTIONS" { return } s.router.ServeHTTP(w, r) }
route.go
package handlers import ( "net/http" "github.com/gorilla/mux" "github.com/jmoiron/sqlx" "github.com/sirupsen/logrus" ) func Register(r *mux.Router, lg *logrus.Logger, db *sqlx.DB) { handler := newHandler(lg, db) r.Use(handler.MiddlewareLogger()) r.HandleFunc("/weather/current", handler.GetCurrentWeather()).Methods(http.MethodPost) r.HandleFunc("/weather/welcome", handler.Test()).Methods(http.MethodGet) }
Correct answer
The first question I noticed was:
AllowedMethods: []string{"GET, POST"},
This probably is:
AllowedMethods: []string{"GET", "POST"},
(or the slightly less error-prone []string{http.MethodGet, http.MethodPost}
)
According to the documentation , this is the default value (so you can omit it):
My next question is "What is origin"; CORS is "Cross-Origin Resource Sharing" and is designed to "prevent client web applications running from one origin from getting retrieved from another origin data", so it's important to know the source of the page making the request. You allow http://localhost:4200
(AllowedOrigins: []string{"http://localhost:4200"}
) so I assume you have two servers on localhost on running (but if this is not the case). If you wish to allow all origins, use "*"
; For testing, I will use test-cors.org - just go to the website, enter the URL, for example " http://127.0.0.1:8080/weather/welcome", enter "Remote URL", click "Send Request" to test.
Your code is a bit confusing (e.g. (s *Server) ServeHTTP
is not used - please aim to provide minimal, reproducible examples when asking here ), so I've simplified things a bit and hopefully the following will point you in the right direction.
package main import ( "context" "fmt" "net/http" "github.com/gorilla/mux" "github.com/rs/cors" ) func main() { s, err := NewServer() if err != nil { panic(err) } s.Run(context.Background()) } type Server struct { router *mux.Router } func NewServer() (*Server, error) { router := mux.NewRouter() Register(router) server := Server{ router: router, } return &server, nil } func (s *Server) Run(ctx context.Context) { cors := cors.New(cors.Options{ AllowedMethods: []string{http.MethodGet, http.MethodPost}, AllowedOrigins: []string{"https://www.php.cn/link/9113c52c5f26af1782e6bf7c56973ef4"}, // AllowedOrigins: []string{"*"}, AllowedHeaders: []string{"Content-Type", "Accept"}, }) server := http.Server{ Addr: fmt.Sprintf(":%d", 8080), Handler: cors.Handler(s.router), } fmt.Println(server.ListenAndServe()) } type handler struct{} func Register(r *mux.Router) { handler := handler{} r.HandleFunc("/", handler.Index).Methods(http.MethodGet) r.HandleFunc("/weather/welcome", handler.Test).Methods(http.MethodGet) } // Index - Provide a simple page with a link to the other page to simplify testing func (h *handler) Index(w http.ResponseWriter, _ *http.Request) { w.Write([]byte(`<a href="weather/welcome" >Test Link</a>`)) } // The real page func (h *handler) Test(w http.ResponseWriter, _ *http.Request) { fmt.Println("Test Called") w.Write([]byte("all OK")) }
The above is the detailed content of Golang application: 'Access-Control-Allow-Origin' header does not exist on the requested resource. For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics











Yes, H5 page production is an important implementation method for front-end development, involving core technologies such as HTML, CSS and JavaScript. Developers build dynamic and powerful H5 pages by cleverly combining these technologies, such as using the <canvas> tag to draw graphics or using JavaScript to control interaction behavior.

How to use JavaScript or CSS to control the top and end of the page in the browser's printing settings. In the browser's printing settings, there is an option to control whether the display is...

Regarding the reasons and solutions for misaligned display of inline-block elements. When writing web page layout, we often encounter some seemingly strange display problems. Compare...

How to achieve the 45-degree curve effect of segmenter? In the process of implementing the segmenter, how to make the right border turn into a 45-degree curve when clicking the left button, and the point...

The method of customizing resize symbols in CSS is unified with background colors. In daily development, we often encounter situations where we need to customize user interface details, such as adjusting...

Real-time Bitcoin USD Price Factors that affect Bitcoin price Indicators for predicting future Bitcoin prices Here are some key information about the price of Bitcoin in 2018-2024:

Compatibility issues of multi-row overflow on mobile terminal omitted on different devices When developing mobile applications using Vue 2.0, you often encounter the need to overflow text...

Tips for Implementing Segmenter Effects In user interface design, segmenter is a common navigation element, especially in mobile applications and responsive web pages. ...
