Question

我试图通过标题中的登录名和密码从服务器获取JSON。

请求中没有凭据。

var app = angular.module("app", []);

app.factory('AuthService', function() {
  var currentUser;
  var login = 'hello@example.com';
  var password = 'hello';

  return {
    //login: function() {

    //},
    //logout: function() {

    //},
    login: login,
    password: password,
    isLoggedIn: function() {
      return currentUser != null;
    },
    currentUser: function() {
      return currentUser;
    }
  };
});

app.run(['$http', 'AuthService', function($http, AuthService) {
  /* Using btoa to do Base64 */
  $http.defaults.headers.common['Authorization'] = 'Basic ' + btoa(AuthService.login + ':' + AuthService.password);
}]);

app.controller('LabController', function($scope, $http){
  $scope.labs = $http.get('http://127.0.0.1:5000/api/v1.0/labs').error(function(data, status, headers, config) {
    //console.log("Data");
    console.log(data);
    //console.log("Headers");
    //console.log(headers());
  });
  window.labs = $scope.labs;
});

以下是我在请求标题中获得的内容。

Host: 127.0.0.1:5000
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:28.0) Gecko/20100101 Firefox/28.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Origin: http://localhost:5000
Access-Control-Request-Method: GET
Access-Control-Request-Headers: authorization
Connection: keep-alive
Cache-Control: max-age=0

Answer 1

我更喜欢用这种方式编写代码..

//This is a web service service which includes get and post type calls and also adds the required authentication headers to all the requests
myApp.factory('webService', function ($http,loadingActivity) {
    return{
        postRequest: function (requestUrl, requestData,contentType,successCallbackFn,errorCallbackFn,showLoading) {
            var httpRequest = {method: "POST", url: requestUrl, headers: {'userName':userName, 'password':password, 'Content-Type': contentType}, data: requestData };
            $http(httpRequest).success(function (data, status) {
                    loadingActivity.hide();
                    successCallbackFn(data,status);
            }).error(function (data, status) {
                    loadingActivity.hide();
                    errorCallbackFn(data,status);
            });
        },
        getRequest:function(requestUrl, contentType, successCallbackFn, errorCallbackFn, showLoading){
            var httpRequest = {method: "GET", url: requestUrl, headers: {'userName':userName, 'password':password, 'Content-Type': contentType}};
            $http(httpRequest).success(function (data, status) {
                    loadingActivity.hide();
                    successCallbackFn(data,status);
            }).error(function (data, status) {
                    loadingActivity.hide();
                    errorCallbackFn(data,status);
            });
         }
    }
});

您可以在此处使用Authorization标头替换userName和password。此代码经过了充分测试，我在生产环境中使用它。在你的控制器中简单地注入webService然后你可以这样调用它。

webService.getRequest(preferences.loginURL+data,"application/json",function(data,status){

},function(data,status){
     showAlert(messages.requestFailedError,"Login Failed!");
},true);

Answer 2

你应该在＆＃34; config＆＃34;阻止而不是＆＃34;运行＆＃34;块。将其更改为

    app.config(['$httpProvider', 'AuthService', function($httpProvider, AuthService) {
       /* Using btoa to do Base64 */
       $httpProvider.defaults.headers.common['Authorization'] = 'Basic ' + btoa(AuthService.login + ':' + AuthService.password);
    }]);

另外，尽量避免使用window对象。如果跨控制器需要它，请创建一个服务来共享该值。

身份验证标头

2 个答案: