Http Get request authorization in Angular

Question

I am using an API that gives me names and statistics for NBA players. I have the following code that leads me to a 401 error (unauthorized).

constructor (private http: Http) {}
fullName;

getPlayerName() {
    this.http.get('https://api.mysportsfeeds.com/v1.1/pull/nba/2016-2017-regular/cumulative_player_stats.json?playerstats=2PA,2PM,3PA,3PM,FTA,FTM').subscribe(data => {
        this.newdata= data.json()
        console.log(this.newdata)
this.fullName = data.json().cumulativeplayerstats.playerstatsentry[0].player.FirstName + " " + data.json().cumulativeplayerstats.playerstatsentry[0].player.LastName
}
}

How can I add the username and password for authentication?

I don't think authentication works by providing a username and password each time you make a call. Do you know how this API provides authorization? Does it use cookies or JWT, for example? — Armen Vardanyan
– Armen Vardanyan, Commented Nov 20, 2017 at 21:18
I am not sure...if you visit the link I provided, a prompt asks you for the username and password. I have an account, I just need to provide angular my username and password. — Usman
– Usman, Commented Nov 20, 2017 at 21:19
No, you are wrong. You should read the documentation of this API (if one exists) to understand how it provides authorization. An API asking for password every time is nonsensical. You see this prompt when you visit the page with the browser, but when you make an XHR call from your app, you need to provide credentials, a token inside your request's headers, for example — Armen Vardanyan
– Armen Vardanyan, Commented Nov 20, 2017 at 21:22
Ok lets say I got the token... where in the code would I provide the credentials? — Usman
– Usman, Commented Nov 20, 2017 at 21:25
maybe this could help mysportsfeeds.com/data-feeds/api-docs/# — dTobon
– dTobon, Commented Nov 20, 2017 at 21:25

Kiarash Feridouni · Accepted Answer · 2017-11-20 21:35:22Z

1

You should set http headers like this example

let headers = new Headers(); headers.append('encrypted_credentials', username + ":" + password);

this.http.get(url, { headers: headers }).subscribe(data => { });

answered Nov 20, 2017 at 21:35

Kiarash Feridouni

112 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Marcel Lamothe · Accepted Answer · 2017-11-20 21:19:48Z

0

From the official docs: https://angular.io/guide/http#headers

One common task is adding an Authorization header to outgoing requests. Here's how you do that:


http
  .post('/api/items/add', body, {
    headers: new HttpHeaders().set('Authorization', 'my-auth-token'),
  })
  .subscribe();

The HttpHeaders class is immutable, so every set() returns a new instance and applies the changes.

answered Nov 20, 2017 at 21:19

Marcel Lamothe

13k10 gold badges36 silver badges46 bronze badges

2 Comments

Marcel Lamothe Over a year ago

What do you mean "the bracket is not closed"?

Usman Over a year ago

Sorry my mistake It does get closed. however I am not sure where this code goes. Also I am getting a number of errors in my text editor when I insert the code... such as "cannot find name HttpHeaders".

Armen Vardanyan · Accepted Answer · 2017-11-20 21:32:40Z

0

Maybe this will help:

this.http.get('https://api.mysportsfeeds.com/v1.1/pull/nba/2016-2017-regular/cumulative_player_stats.json?playerstats=2PA,2PM,3PA,3PM,FTA,FTM', {headers: new HttpHeaders().set('username', myUsername).set('password', myPassword)}).subscribe(// handle Result)

answered Nov 20, 2017 at 21:32

Armen Vardanyan

3,3251 gold badge16 silver badges34 bronze badges

Collectives™ on Stack Overflow

Http Get request authorization in Angular

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related