How can i add WebApi header in angularJs

Question

I have the following code to call WebApi from localhost, which working great.

var app = angular.module('myApp', []);
app.controller('employeesController', function ($scope, $http) {
    $http({
        Method: 'GET',
        url: 'http://localhost:50515/api/employees'
    }).then(function (result) {
        $scope.Getemployees = result.data;
    });    
});

i also setup WebApi service which working great tested using postman. But i would like to include WebApi Header information: ApiKey name and apikey value. how can i modify the above script?

url: https://example.api.services/api/XX/v2/employees/all   //url from postman
Key: api-key
value: ba741c13417b7775524dbf0f417cefc4

You set the headers in your `$http` call. See [AngularJS: API: $http](https://docs.angularjs.org/api/ng/service/$http#setting-http-headers) for a reference. The documentation will also show how to set this on a "global" level so that you only need to set this up in a single place (and not litter your code) — Brendan Green, Nov 14 '19 at 06:15

score 1 · Answer 1 · answered Nov 14 '19 at 07:06

1

In the headers parameter add an object with a key-value pair.

$http({
    Method: 'GET',
    url: 'http://localhost:50515/api/employees',
    headers: {
        'api-key': 'ba741c13417b7775524dbf0f417cefc4'
    },
}).then(function (result) {
    $scope.Getemployees = result.data;
});

answered Nov 14 '19 at 07:06

Lemuel Castro

166
11

how can i call it from the browser? see api result from browser – Rob Nov 15 '19 at 03:09
@Kuku refer to this [anwser](https://stackoverflow.com/a/4423097/9939798) – Lemuel Castro Nov 15 '19 at 05:11

How can i add WebApi header in angularJs

1 Answers1