swordfish
swordfish

Reputation: 959

Ionic - blocked by CORS policy: No 'Access-Control-Allow-Origin'

I've created an Ionic app that connected to an API website where i have connected my website to CloudFlare for protection purposes, before i enabled the Under Attack Mode the requests where sent perfectly without any errors, but now it shows an error in console that saying:

Access to XMLHttpRequest at 'https://mywebsite.org/api/mobile/news?pageSize=15&currentPage=1&language=undefined' from origin 'http://localhost:8100' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

The back-end is a flask micro service and i am also enabling the cors roles,

cors.init_app(app, resources={r"https://mywebsite.org/api/*": {"origins": "https://mywebsite.org"}})

Every time i am sending a get request from the app, i am also adding a Access-Control-Allow-Origin to the headers:

let headers = new HttpHeaders({
    "Access-Control-Allow-Origin":"https://mywebsite.org/",
    "origin":"https://mywebsite.org/"
});

@Injectable({
    providedIn: 'root'
})
export class DataApiService {

    private apiUrl: string = 'https://mywebsite.org/api';


    constructor(
    private http: HttpClient,
    private translate: TranslateService
    ) { }

    // Get news
    apiRequest(url: string, params?:any){

    const apiUri = `${this.apiUrl+url}`;

    if(params){
        params.language = this.translate.getDefaultLang();
    }

    return this.http.get(apiUri, { headers: headers, params: params }).pipe(
        delay(
        500
        ),
        map(
        (res:any) => {
            return res
        }
        )
    )
    }
}

Please any help.

Upvotes: 1

Views: 12518

Answers (1)

RealTak
RealTak

Reputation: 106

watch this

https://ionicframework.com/docs/troubleshooting/cors

you have to add host not localhost (ionic serve --host test.test.co)

then go your local disk

move here C:\Windows\System32\drivers\etc

then modify your hosts file

127.0.0.1 test.test.co

sry for not being good at English

I hope it helped

Upvotes: 1

Related Questions