Búsqueda de sitios web

typescript - Angular - bloqueado por la política CORS: El encabezado 'Access-Control-Allow-Origin' contiene múltiples valores '*', '*'

Recibo un error cuando intento conectarme a un servicio REST que está en otro dominio. Entiendo que se puede resolver agregando CORS en el servicio REST de Java. Pero, ¿sería posible hacerlo cambiando algo en el lado 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 '*, *'

Mi servicio Rest: http://someurl/RestWeb/getPerson, todos mis URLs de servicio rest son como: http://someurl/RestWeb/SOMETHING

Y mi URL de Angular: http://someotherurl

Después de buscar en diferentes artículos, ya intenté cambiar proxy.conf.json y package.json. A continuación mis cambios, todavía estoy obteniendo lo mismo.

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",

servicio :

  findAll(): Observable<Person[]> {
    return this.httpClient.get<string[]>('http://someurl/RestWeb/getPerson');
  }

ejecutar usando:

npm start

Como medida temporal, ahora estoy probando mi aplicación en el navegador Chrome usando

chrome.exe --user-data-dir="C://Chrome dev session" --disable-web-security

Respuesta #1

Parece que se ha hecho un uso indebido del proxy de webpack-dev-server.

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.ts
import { 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()
    );
  }
}

Respuesta #2

En tu archivo de configuración del proxy, estás configurando el proxy para tu http://localhost:4200/api*. Por lo tanto, el proxy no funcionará para /getPerson

Artículos relacionados