Go + echo + gqlgen에서 unable to upgrade *echo.Response to websocket websocket: request origin not allowed by Upgrader.CheckOrigin: 에러가 발생

개요

Go + echo + gqlgen에서

unable to upgrade *echo.Response to websocket websocket: request origin not allowed by Upgrader.CheckOrigin:

에러가 발생해서 수정했던 기록

문제

grahql의 subscription을 사용해야 하는 요건이 있어서 추가했지만, API를 호출하면 이하의 에러가 발생한다.

unable to upgrade *echo.Response to websocket websocket: request origin not allowed by Upgrader.CheckOrigin:

원인

밑의 코드를 보면 AddTransport에서 Websocket의 설정을 하고 있는데 Upgrader의 CheckOrigin의 설정을 보면 화면단의 URL을 허용하고 있기 때문에 에러가 발생하는게 이해가 안되는 상황이었다.

gqlHandler := *handler.NewDefaultServer(
	graph.NewExecutableSchema(graph.Config{Resolvers: &graph.Resolver{
		// ...
	}}),
)

// For GraphQL Subscription
gqlHandler.AddTransport(&transport.Websocket{
	KeepAlivePingInterval: 10 * time.Second,
	Upgrader: websocket.Upgrader{
		CheckOrigin: func(r *http.Request) bool {
			origin := r.Header.Get("Origin")
			allowedOrigins := []string{
				"http://localhost:3000",
			}
			for _, allowed := range allowedOrigins {
				if origin == allowed {
					return true
				}
			}
			return false
		},
	},
})

ChatGPT와 상담을 진행해도 계속 제자리걸음이었기 때문에 검색으로 찾아본 결과

NewDefaultServer에서 이미 Websocket의 설정을 하고 있기 때문에 내가 따로 커스텀으로 추가한 설정이 무효화 되고 있는게 원인이었다. 

 

밑은 관련이슈

https://github.com/99designs/gqlgen/issues/2826

when i setup subscription endpoint(websocket connection) in my gqlgen + go code, it display an error as unable to upgrade *http

 

 

해결

그래서 이하와 같이 수정

gqlHandler := *handler.New(
	graph.NewExecutableSchema(graph.Config{Resolvers: &graph.Resolver{
		// ...
	}}),
)
gqlHandler.Use(presenters.NewTracer(m))

// Default Setting
// ref. https://github.com/99designs/gqlgen/blob/master/graphql/handler/server.go#L49
gqlHandler.AddTransport(&transport.Options{})
gqlHandler.AddTransport(&transport.GET{})
gqlHandler.AddTransport(&transport.POST{})
gqlHandler.AddTransport(&transport.MultipartForm{})
gqlHandler.SetQueryCache(lru.New[*ast.QueryDocument](1000))
gqlHandler.Use(extension.AutomaticPersistedQuery{
	Cache: lru.New[string](100),
})
gqlHandler.Use(extension.Introspection{})

// For GraphQL Subscription
gqlHandler.AddTransport(&transport.Websocket{
	KeepAlivePingInterval: 10 * time.Second,
	Upgrader: websocket.Upgrader{
		CheckOrigin: func(r *http.Request) bool {
			origin := r.Header.Get("Origin")
			allowedOrigins := []string{
				"http://localhost:3000",
			}
			for _, allowed := range allowedOrigins {
				if origin == allowed {
					return true
				}
			}
			return false
		},
	},
})

 

배운점

때론 AI보다 검색이 좋다