Add HTTP basic authentication to this HTTP GET in angularjs

Question

I have an existing angularjs code which makes a HTTP GET. Extracted below is some relevant code inside the controller.

    .controller('imptViewCtrl', ['$scope', '$http', 
        function ($scope, $http, ) {
                    var url = $configuration.webroot + '/impt/list?list=testlist';
                    $http.get(url).then(function (response) {
                               tableData = response.data;
                               });
        }]);

I would like to add HTTP basic authentication to the HTTP GET. The username is foo and the password is bar. How can this be done?

Maybe this could help: stackoverflow.com/questions/18877715/… ? — ssougnez
– ssougnez, Commented Dec 22, 2015 at 10:46

user5698801 · Accepted Answer · 2015-12-22 13:26:19Z

23

Because in basic authentication, the username and password are decode by base64. You need to find a library to do this work for comfortable first.

https://github.com/ninjatronic/angular-base64

After that, load base64 into your app and config headers.

angular
    .module('myApp', ['base64'])
    .config(function($httpProvider, $base64) {
        var auth = $base64.encode("foo:bar");
        $httpProvider.defaults.headers.common['Authorization'] = 'Basic ' + auth;
    })

You can also provide the authentication header to get function seprately if you like.

var auth = $base64.encode("foo:bar"), 
    headers = {"Authorization": "Basic " + auth};
$http.get(url, {headers: headers}).then(function (response) {

answered Dec 22, 2015 at 13:26

user5698801

5744 silver badges10 bronze badges

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

3 Comments

guagay_wk Over a year ago

Your code looks ok but I have trouble getting it working. I have asked another question. stackoverflow.com/questions/34429313/…

guagay_wk Over a year ago

Your code is working. I think it is my server that is giving the problem. Marked as correct answer.

splintor Over a year ago

Why do you require a library to do base64? why not use btoa() w3schools.com/jsref/met_win_btoa.asp ?

ryan.wise · Accepted Answer · 2016-10-27 20:03:14Z

16

Rather than using a library to encode your auth by base 64, you could just use:

window.btoa("user:pass")

it's supported by most browsers.

https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/btoa

answered Oct 27, 2016 at 20:03

ryan.wise

4793 silver badges10 bronze badges

2 Comments

DRaehal Over a year ago

What about post, put, delete, et. al.?

superjos Over a year ago

@DRaehal the way you authenticate a request does not depend on the HTTP verb of the request. If the target endpoint needs Basic authentication, you just apply that header, whether it's a POST, PUT, etc.

Collectives™ on Stack Overflow

Add HTTP basic authentication to this HTTP GET in angularjs

2 Answers 2

3 Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related