Angular-Go API 通信を保護する方法: 認証ヘッダーの追加?

Angular HTTP リクエストに認可ヘッダーを追加する方法

Angular アプリケーションを Go API に接続しようとするときは、認可を含めることが重要ですHTTP リクエストのヘッダー。これにより、クライアントとサーバー間の通信が保護されます。以下はこれを実現する方法を示しています:

Angular 実装:

Angular 4 以降では、HTTP インターセプターを使用して認可ヘッダーをリクエストに一貫して適用することをお勧めします。これはインターセプターの例です:

import { Injectable } from '@angular/core';
import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';

import { Observable } from 'rxjs';

import { AuthService } from './auth.service';

@Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    req = req.clone({
      setHeaders: {
        Authorization: `Bearer ${AuthService.getToken()}`,
      },
    });

    return next.handle(req);
  }
}

このインターセプターは Angular モジュールに登録できます:

import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';

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

Go 実装:

Go では、CORS ヘッダーは Angular アプリケーションによって送信されたものと一致する必要があります。すべてのヘッダーを許可するには、次のコマンドを使用します。

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

または、許可されるヘッダーを慎重に定義します。

これらの手順を実行すると、承認ヘッダーが正常に送信および受け入れられ、 Angular と Go の間の通信。

以上がAngular-Go API 通信を保護する方法: 認証ヘッダーの追加?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。