How to call REST service with Basic Authentication in Angularjs 2.0?

Question

I have java REST services and consumer in Angularjs 1.3. Services are JSON based and expect BASIC authentication (username-password). In AgJs 1.3, I used Base64 factory code (found on google) for creating basic authentication token from username and password and able to consume services SUCCESSFULLY.

I read HTTP class in AgJs 2.0 documentation but I didn't find any information about basic authentication.

Could anybody please provide sample code to consume REST services in Angularjs 2.0 using BASIC authentication?

Thanks in advance!

Best Regards!

My AgJs 1.3 code:

var url = "http://x.x.x.x:xxxx/data/" + number;

$http.defaults.headers.common['Authorization'] = 'Basic ' + Base64.encode('username' + ':' + 'password');
$http.defaults.headers.common['Content-Type'] = 'application/json';

$http({ method: 'GET', url: url }).
        success(function (data, status, headers, config) {
           alert(data);
        }).
        error(function (data, status, headers, config) {
            alert("error: " + data);
        });

I don't know if you are the same user as in this [issue](https://github.com/angular/angular/issues/3266) but in case it could help anybody else... — Eric Martinez, Aug 01 '15 at 21:39
Have a look at [this answer](http://stackoverflow.com/a/34465070/995671) to a similar question. — John Smith, May 11 '16 at 10:47

score 1 · Answer 1 · answered Jan 06 '17 at 12:23

I have just make a post from angular2 to a server that has Basic auth and this works:

    sendAuthentification(credentials: string): Observable<any> {
          var headers = new Headers();
          headers.append('Authorization', 'Basic ' +  btoa('user:pass'));

          return this.http.get("http://ip/yourpost", headers});
   }

Hope this answer your question.

score 0 · Answer 2 · answered Aug 09 '15 at 08:25

Depends if you're using the new Angular2 http api, or something external like fetch.

If the latter you could do something like this, just remember to wrap with zone:

myHeaders = {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
        'Authorization': 'Basic ' + Base64.encode('username' + ':' + 'password')
    }
return Zone.bindPromiseFn(fetch)(
            url,
            {
                method: 'GET',
                headers: myHeaders,
                body: JSON.stringify(myData)
            }).then(
                r => {return r.json()}
        );

How to call REST service with Basic Authentication in Angularjs 2.0?

2 Answers2

Linked