Reading HTTP server header response messages in angularjs

Question

I am doing Ajax requests to server in following way:

App Setup:

var appRoot = angular.module('demoApp', ['ngRoute', 'ngResource']);
appRoot.config(['$routeProvider', function($routeProvider) {
         $routeProvider
         .when('/', { templateUrl: '/ngPartials/_Login.html', controller: 'LoginCtrl' })
         .otherwise({ redirectTo: '/ngPartials/_Login.html', controller: 'LoginCtrl' });
        }
]);

Factory:

appRoot.factory('LoginResource', function ($resource) {
    return $resource('/Login/Login');
});

Controller:

appRoot.controller('LoginCtrl', function ($scope, LoginResource) {
    //Make a get request on login resource
    $scope.User = LoginResource.get(
    {
       Role: val,
       Email_Id: $scope.Email,
       Pwd: $scope.Password
    }, function (response) { 
    //do someting in callback function
    });
});

Now whenever I do Ajax request from controller I want to read the http header messages returned from the server and depending on the message I need to proceed.

Here in this Article it has shown, how to read header messages returned from the server. But I am getting confuse how to read headers in my case.

EDIT: If there is no way to achieve this with $resource and only possible with $http what changes need to be done in factory so that I don't need to change the calling from the controller? It will be costly for me to change the all the REST request in controller since I need to implement the change in whole project.

I tried to done following changes in my factory so that I'll be able to read headers as suggested by Michal. The ajax request is being done properly and my server login method is hit properly but the parameters I am sending through angular $http request are not being binded to my server login action method model:

appRoot.factory('LoginResource', function ($resource, $http) {
    var loginResource = {
        response:{},
        get: function (param) {
            $http.get('/Login/Login', param).
             success(function (data, status, headers, config) {

                 this.response = data;
             }).
             error(function (data, status, headers, config) {
                 alert('error');

            });
        }
    }
    return loginResource;
});

server side model:

public class LoginModel
{
    public string Role { get; set; }
    public string Email_Id { get; set; }
    public string Pwd { get; set; }
    public bool IsEmailValidation { get; set; }

}

Action method:

public JsonResult Login(LoginModel oLogin)
{
   ...
}

What wrong I am doing?

Michał Lach · Accepted Answer · 2015-02-21 09:07:57Z

0

You can`t do this with $resource, it only provides high level API, you need $http for reading http requests.

answered Feb 21, 2015 at 9:07

Michał Lach

1,2784 gold badges20 silver badges39 bronze badges

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

1 Comment

Saurabh Palatkar Over a year ago

Can you show me some way to make rest calls to server so that I can use $http in a similar way similar to what currently doing with $response without or with little change. I've used the $response in my whole project, so please tell me such a way so that I just make a change in my factory without much or no change in controller.

F. Geraerts · Accepted Answer · 2015-04-02 15:49:14Z

The success callback function has a second parameter in return

Here is an extract of the angular doc :

Success callback is called with (value, responseHeaders) arguments. Error callback is called with (httpResponse) argument.

Link : Angular $Resource

So in your callback you can get the response headers like this:

appRoot.controller('LoginCtrl', function ($scope, LoginResource) {
    //Make a get request on login resource
    $scope.User = LoginResource.get(
    {
       Role: val,
       Email_Id: $scope.Email,
       Pwd: $scope.Password
    }, function (response,responseHeader) {

      var headers = responseHeader();

    //do someting in callback function
    });
});

The headers object contains the headers returned from the server side

Collectives™ on Stack Overflow

Reading HTTP server header response messages in angularjs

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related