やりたいこと
フロント側の http://localhost:8080/
からバックエンド側の http://localhost:8080/
を呼び出したい
しかし以下のエラーがフロント側で出ていたので、これを解決したい
Access to XMLHttpRequest at 'http://localhost:8000' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
オリジン管理ソース共有に関してはこの記事では解説しませんが、 こちらの記事 がわかりやすかったです
環境情報
- vue
- 2.6
- go
- 1.15
- echoをサーバーとして使用
解決方法
以下の設定を追加
e := echo.New()
// 以下を追加
e.Use(middleware.CORSWithConfig(middleware.CORSConfig{
AllowOrigins: []string{"http://localhost:8080"},
AllowMethods: []string{http.MethodGet, http.MethodPost, http.MethodPost, http.MethodDelete},
}))
無事フロント側からアクセスできる様になりました!
参考
- なんとなく CORS がわかる...はもう終わりにする。
- CORS Middleware