Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Binance API and angular 4 httpClient

I have a question about cryptomarket Binance. They have public api which I though I could use in angular to create trading app.

But I have some troubles. Using that link in chrome I get json result. https://api.binance.com/api/v1/exchangeInfo

But using with angular 4 httpClient:

this.http.get('https://api.binance.com/api/v1/exchangeInfo').subscribe(res => console.log(res));

I have error: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at api.binance.com/api/v1/exchangeInfo. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

It doesn't work. I don't get it, why I can't use that API in angular app?https://github.com/binance-exchange/binance-official-api-docs/blob/master/rest-api.md

What should I do? Should I set headers like that:

getMarkets() {
    const headers = new HttpHeaders();
    headers.set('Content-Type', 'application/json');
    headers.set('Accept', 'application/json');
    headers.set('Access-Control-Allow-Headers', 'Content-Type');
    headers.set('Access-Control-Allow-Origin', '*');

    const path = 'https://api.binance.com/api/v1/exchangeInfo';
    return this.http.get(path, {headers: headers});
}

Thanks in advance

like image 663
Adam Adamski Avatar asked Jan 11 '18 08:01

Adam Adamski


People also ask

Can I use Binance API without verification?

Please complete account verification for full access to Binance API services. Binance continually reviews its products and services to ensure that we are prioritizing user protection and creating a sustainable crypto ecosystem for everyone.

Does Binance have a REST API?

More specifically, Binance has a RESTful API that uses HTTP requests to send and receive data. Further, there is also a WebSocket available that enables the streaming of data such as price quotes and account updates.


2 Answers

You can't quite use it directly like that, Binance API does not set CORS headers, so Chrome and all major browsers will block the requests. There is a bit more to it, but essentially, the api servers that need to enable support for CORS should set Access-Control-Allow-Origin to be * or a single domain www.example.com, this allows the browsers to prevent malicious code on a site to call and read the response of some data from other site you might be logged on to ( eg: bank info ) You can read more about it here

One possible solution is to have your own server that proxies calls to binance

Another solution if you're testing things out is to use a CORS enabling extension like this one

Update: You can also use the websocket API if that satisfies your data needs docs

Update 2: Here's a good stackoverflow question on cors

Side note: If your bank's API server sets the Access-Control-Allow-Origin to * then change banks :)

like image 183
jay Avatar answered Sep 29 '22 08:09

jay


Try this simple request without headers.

 this.http.get('https://api.binance.com/api/v1/exchangeInfo').subscribe(data => {
      this.results = data;
    });
  }

It work for me

like image 33
Léo R. Avatar answered Sep 29 '22 07:09

Léo R.