angular - Project deploy blocked by CORS policy

Question

I would like to deploy a PWD with Ionic, but I cannot get the communication with the API to return the requested information.

I thinking that problem is for security to access by HTTP request.

My service code:

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { ResponseTopHeadlines } from '../models/models';
import { environment } from 'src/environments/environment';

const apiAkey = environment.apiKey;
const apiUrl = environment.apiUrl;

const headers = new HttpHeaders({
  'X-Api-Key': apiAkey,
});

@Injectable({
  providedIn: 'root',
})
export class NewsService {
  headLinesPage = 0;
  categoryAct = '';
  categoryPg = 0;

  constructor(private http: HttpClient) {}

  private startQuery<T>(query: string) {
    query = apiUrl + query;
    return this.http.get<T>(query, { headers });
  }

  getTopHeadLines() {
    this.headLinesPage++;
    return this.startQuery<ResponseTopHeadlines>(
        `/top-headlines?country=us&page=${this.headLinesPage}`,
    );
  }

  getTopHeadLinesCategory(category: string) {
    if (this.categoryAct === category) {
        this.categoryPg++;
    } else {
          this.categoryPg = 1;
          this.categoryAct = category;
     }
     return this.startQuery<ResponseTopHeadlines>(
       `/top-headlines?country=us&category=${category}&page=${this.categoryPg}`,
     );
  }
}

question from:https://stackoverflow.com/questions/66051522/project-deploy-blocked-by-cors-policy

Answer 1

Waitting for answers