Bagaimana untuk Menyelesaikan Ralat CORS Apabila Menambah Pengepala Kebenaran dalam Sudut?

Menambah Pengepala Keizinan pada Permintaan HTTP Sudut

Masalah:

Aplikasi Sudut sedang mengalami ralat CORS apabila menambahkan pengepala "Kebenaran" pada permintaan HTTP. Ralatnya ialah:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 403

Amalan Terbaik:

Dalam Sudut 4 dan lebih baru, disyorkan untuk menggunakan Pemintas HTTP untuk menambah pengepala pengesahan pada permintaan dan Pengawal untuk melindungi laluan.

Sudut Pelaksanaan:

Untuk menggunakan AuthInterceptor, buat fail TypeScript (cth., auth.interceptor.ts):

import { HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
import { Injectable } from '@angular/core';
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: {
        'Content-Type' : 'application/json; charset=utf-8',
        'Accept'       : 'application/json',
        'Authorization': `Bearer ${AuthService.getToken()}`,
      },
    });

    return next.handle(req);
  }
}

Seterusnya, daftarkan pemintas dalam app.module.ts :

import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
import { AuthInterceptor } from '../auth/auth.interceptor';

...

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

...

Pergi Pelaksanaan:

Di sebelah Go, pastikan perisian tengah CORS membenarkan pengepala permintaan yang diperlukan:

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

Jika isu berterusan, konfigurasikan tetapan CORS dengan teliti agar sepadan dengan pengepala dihantar oleh pelanggan.

Atas ialah kandungan terperinci Bagaimana untuk Menyelesaikan Ralat CORS Apabila Menambah Pengepala Kebenaran dalam Sudut?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!