I am trying to send a get request to the Wikipedia API. I am sending the request form a angular frontend so i’m trying to use the Heroku CORS Anywhere endpoint to avoid CORS issues. For some reason, I’m still getting a 503 response saying no access-control-allow-origin header is present on the requested resource. Any idea why this would happen/what else I can try?
My code:
JavaScript
x
20
20
1
import { Injectable } from '@angular/core';
2
import { Http, Response, } from '@angular/http';
3
import { Observable } from 'rxjs/Rx';
4
5
6
7
@Injectable()
8
export class RestService {
9
API_URL: string = 'https://cors-anywhere.herokuapp.com/https://en.wikipedia.org/wiki/';
10
11
constructor(private http: Http) { }
12
13
public getRandomArticle() : Observable<any> {
14
return this.http.get(`${this.API_URL}Special:Random`)
15
.map((res: Response) => res.json())
16
.catch((err: any) => Observable.throw(err || 'server error'));
17
}
18
19
}
20
Advertisement
Answer
You can deploy a CORS Anywhere server to Heroku in just 2-3 minutes, with 5 commands:
JavaScript
1
6
1
git clone https://github.com/Rob--W/cors-anywhere.git
2
cd cors-anywhere/
3
npm install
4
heroku create
5
git push heroku master
6
After running those commands, you’ll end up with your own CORS Anywhere proxy running at, e.g. https://cryptic-headland-94862.herokuapp.com/
. So then instead of prefixing your request URL with https://cors-anywhere.herokuapp.com
, prefix it with your proxy’s URL.