typescript - Angular - blocat de politica CORS: Header-ul 'Access-Control-Allow-Origin' conține mai multe valori '* , *'
Primești o eroare atunci când încerci să te conectezi la un serviciu REST care se află pe un alt domeniu. Înțeleg că poate fi rezolvat prin adăugarea CORS în serviciul REST Java. Dar este posibil să se rezolve schimbând ceva pe partea de Angular?
Access to 'http://someurl/RestWeb/getPerson' XMLHttpRequest at from origin 'http://localhost:4200' has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header contains multiple values '*, *'
Serviciul meu Rest: http://someurl/RestWeb/getPerson, toate URL-urile serviciului meu Rest sunt de genul: http://someurl/RestWeb/SOMETHING
Și URL-ul meu Angular: http://someotherurl
După ce am căutat diferite articole, am încercat deja să schimb proxy.conf.json și package.json. Mai jos sunt modificările mele, și tot primesc același rezultat.
proxy.conf.json
{
"/RestWeb": {
"target": "http://someurl/",
"secure": false,
"changeOrigin": true // I tried with and without this. No luck
}
}
package.json
"start": "ng serve --proxy-config proxy.conf.json",
serviciu :
findAll(): Observable<Person[]> {
return this.httpClient.get<string[]>('http://someurl/RestWeb/getPerson');
}
rulează folosind:
npm start
Ca măsură temporară de contracarare, acum îmi testez aplicația în browserul Chrome folosind
chrome.exe --user-data-dir="C://Chrome dev session" --disable-web-security
Răspuns #1
Se pare că proxy-ul din webpack-dev-server a fost folosit greșit.
proxy.conf.json{
"/api": {
"target": "http://someurl.com/",
"changeOrigin": true,
"secure": false,
"pathRewrite": {
// replace `/api` with empty string, because real api path isn't contain
// `/api` segment
// eg: http://localhost:4200/api/getPerson => http://someurl.com/getPerson
"/api": ""
}
}
}
person.service.tsimport { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
@Injectable()
export class PersonService {
constructor(private http: HttpClient) {}
async getPerson() {
return (
this.http
// you shouldn't use `http://someurl.com/getPerson` url directly,
.get('/api/getPerson')
.toPromise()
);
}
}
Răspunsul #2
În fișierul tău de configurare a proxy-ului, configurezi proxy-ul pentru http://localhost:4200/api*. Deci, proxy-ul nu va funcționa pentru /getPerson
