Angular HTTP 헤더 및 Go CORS 문제를 해결하는 방법은 무엇입니까?

Angular HTTP 헤더 및 Go CORS 문제 해결

CORS(Cross-Origin Resource Sharing)는 Angular 앱을 Go API에 연결할 때 골치 아픈 원인이 되는 경우가 많습니다. Angular에서 Authorization 헤더를 추가하는 방법을 이해하고 Go에서 CORS를 처리하는 것은 둘 사이의 성공적인 통신을 위해 중요합니다.

Angular Authorization 헤더

Angular에서 Authorization 헤더를 추가하려면 Http 인터셉터를 활용해야 합니다. 인증 인터셉터의 예는 다음과 같습니다.

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    req = req.clone({
      setHeaders: {
        'Content-Type': 'application/json; charset=utf-8',
        'Accept': 'application/json',
        'Authorization': `Bearer ${AuthService.getToken()}`,
      },
    });
    return next.handle(req);
  }
}

앱 모듈에 인터셉터를 등록합니다.

providers: [
  {
    provide : HTTP_INTERCEPTORS,
    useClass: AuthInterceptor,
    multi   : true,
  },
],

Go CORS 처리

Go 코드가 다음을 허용하는지 확인하세요. Angular 앱에서 필요한 요청 헤더:

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

문제가 지속되는 경우, 클라이언트의 요청 헤더와 일치하도록 CORS 설정을 주의 깊게 구성하세요.

해결된 문제의 예

다음 Angular 코드:

this.http.get<ProjectedBalance>(requestUrl, {headers: new HttpHeaders().set('Authorization', 'my-auth-token')})

다음 Go 코드와 결합:

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

Angular 앱과 Go 간의 통신이 성공적으로 설정되어야 합니다. API.

위 내용은 Angular HTTP 헤더 및 Go CORS 문제를 해결하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!