CORS problem in a angular application

Hi to everybody,
I’m getting an issue with CORS. I’m developing a webapp application (angular) in which I offer vegetation idexes maps. During the token retrivation with the folowing link ‘https://services.sentinel-hub.com/auth/realms/main/protocol/openid-connect/token’ I obtain status code 200, but with CORS exception.

How can I solve it? Thank you in advance

Hi Davide,

Please can you share some code relevant to your error so we can help you out?

Here the code I’m using to retrive the access token. This is a part of my angular class service with the following methods:

  • get_sentinel_token(): when I run this method I get status code 200 (POST request) but I cannot received the token for the CORS exception.
@Injectable({
  providedIn: "root",
})
export class SentinelHubService {
  //tokenUserLogued$ = new EventEmitter<string>();
  public readonly API = env.enviroments;

  constructor(
    private router: Router,
    public http: HttpClient,
    private communFunc: CommunfuncService,
    // public sweetA: SweetService
  ) {}

get_sentinel_token(){
  const authData = {
    grant_type:    this.API.sentinel.token_grant_type,
    client_id:     this.API.sentinel.token_client_id,
    client_secret: this.API.sentinel.token_client_secret,
  };
  const headers = new HttpHeaders({'Content-Type': 'application/x-www-form-urlencoded'});
  const body = Object.keys(authData).map((key) => encodeURIComponent(key) + '=' + encodeURIComponent(authData[key])).join('&');

  console.log('generando el token');
  console.log(body);
  return this.http.post<any>(this.API.sentinel.token_url, body, { headers: headers });
}
}

Dear Davide,

An OAuth client that is going to be used in a single page web app must have this option enabled; Client will be used by a single-page application (SPA) option needs to be checked and then allowed domains need to be set.

See the docs for more info.

1 Like

Thank you!

I updated the settings in “Update existing OAuth Client” window, I checked “Client will be used by a single-page application” and I added the used domain: “https://oliver.sigmaconsulting.it/”.

Again the service gives me CORS error, I can solve it installing a plugin on the browser (Google Chrome) that allow me to “Enable CORS”.

How can I make it work the webapp without that plugin?

Try using a wildcard (*) in the domain specification: https://oliver.sigmaconsulting.it*
If that doesn’t work, check allow all domains if that fixes the issue.

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.