4

Below is my service call where I am trying to do a basic auth. I have checked multiple blogs could not find the solution for this.

Can anybody help me to solve this issue as I am getting below error:

XMLHttpRequest cannot load

Response for preflight has invalid HTTP status code 401

I could not find the basic auth in the network tab in developer options also.

function() {
    "use strict";
    var APIservice = function($http, $base64) {
        var getDetails = function(postData) {
            $http.defaults.headers.common['Access-Control-Allow-Origin'] = "*";
            $http.defaults.headers.common['Access-Control-Allow-Methods'] = "GET,PUT,POST,DELETE,OPTIONS";
            $http.defaults.headers.common['Access-Control-Allow-Headers'] = "Content-Type, Authorization, Content-Length, X-Requested-With";
            $http.defaults.headers.common['Content-Type'] = undefined;
            console.log($http.defaults.headers.common.Authorization);
            //console.log($http.defaults.headers.common.Authorization);
            return $http.get('http://52.74.68.202:8080/rest/v1/step/all')
                .then(function(response, headers, config) {
                    console.log(response);
                    return response;
                });
        };
        return {
            getDetails: getDetails
        }
    }
    var module = angular.module('expframework');
    module.factory("APIservice", APIservice);
    module.run(['$http', '$base64', function($http, $base64) {
        var authdata = $base64.encode('test:test');
        $http.defaults.headers.common['Authorization'] = 'Basic ' + authdata;
    }]);
    module.config(['$httpProvider', '$base64', function($httpProvider, $base64) {
        var authdata = $base64.encode('test:test');
        $httpProvider.defaults.headers.common['Authorization'] = 'Basic ' + authdata;
    }])
}();

It is working in Safari and emulators but not working in Chrome and Firefox

Please help me to fix this. Thanks in advance.

Community
  • 1
  • 1
  • CORS headers mustn't be set by browsers but by servers: browsers will then first send an OPTIONS request to known if actual request is authorized. What kind of server is listening on http://52.74.68.202:8080/rest? Looks like a Tomcat one? – sp00m Jul 12 '16 at 10:29
  • Do you have CORS enabled on your server? You need to let the OPTIONS preflight request to have access. – Daniel Higueras Jul 12 '16 at 10:29
  • @sp00m - yes it is Tomcat and below is the response headers Access-Control-Allow-Headers:Authorization,Content-Type,X-Token Access-Control-Allow-Methods:POST, PUT, GET, OPTIONS, DELETE Access-Control-Allow-Origin:* Access-Control-Expose-Headers:Message Access-Control-Max-Age:3600 Allow:GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH Cache-Control:no-cache, no-store, max-age=0, must-revalidate Content-Length:0 Date:Tue, 12 Jul 2016 10:34:14 GMT Pragma:no-cache Server:Apache-Coyote/1.1 WWW-Authenticate:Basic realm="IntApp-Basic" – raghuveer ambedkar Jul 12 '16 at 10:33
  • @DanielHigueras - please check my above comment. all the headers are added in my server – raghuveer ambedkar Jul 12 '16 at 10:35
  • and this call is working in safari and emulators – raghuveer ambedkar Jul 12 '16 at 10:36
  • `Access-Control-Allow-*` headers should be removed from `$http.defaults.headers.common`. What headers are actually attached to requests? And a 401 error is weird: looks like the server is trying to authenticate OPTIONS requests. What COTS are you using for the authn? Could you try to exclude OPTIONS requests from the authn chain? – sp00m Jul 12 '16 at 10:38
  • whatever above comment code is response headers below are the request headers and If I remove Access-Control-Allow also it is not working. Accept:*/* Accept-Encoding:gzip, deflate, sdch Accept-Language:en-US,en;q=0.8 Access-Control-Request-Headers:accept, access-control-allow-headers, access-control-allow-methods, access-control-allow-origin, authorization Access-Control-Request-Method:GET Cache-Control:no-cache Connection:keep-alive Host:52.74.68.202:8080 – raghuveer ambedkar Jul 12 '16 at 10:45
  • Could help: http://stackoverflow.com/a/15734032/1225328 – sp00m Jul 12 '16 at 10:45
  • @sp00m - I just hit the rest api using postman with options request here is what i got **headers** Access-Control-Allow-Headers →Authorization,Content-Type,X-Token Access-Control-Allow-Methods →POST, PUT, GET, OPTIONS, DELETE Access-Control-Allow-Origin →* Access-Control-Expose-Headers →Message Access-Control-Max-Age →3600 Allow →HEAD,GET,OPTIONS Cache-Control →no-cache, no-store, max-age=0, must-revalidate Content-Length →568 Content-Type →application/vnd.sun.wadl+xml;charset=UTF-8 Expires →0 X-Content-Type-Options →nosniff X-Frame-Options →DENY – raghuveer ambedkar Jul 12 '16 at 10:52
  • body of postman option call – raghuveer ambedkar Jul 12 '16 at 10:53
  • 1
    @sp00m - Thanks you are correct. Great help! Thanks guys for your help. We are finally able to resolve it, It is because of server was trying to authenticate OPTIONS requests. – raghuveer ambedkar Jul 12 '16 at 13:03

1 Answers1

2

Since your server threw a 401, I guess it tried to authenticate the preflight request. From https://stackoverflow.com/a/15734032/1225328:

The W3 spec for CORS preflight requests clearly states that user credentials should be excluded.

[...]

Simply have the server (API in this example) respond to OPTIONS requests without requiring authentication.

Community
  • 1
  • 1
sp00m
  • 47,968
  • 31
  • 142
  • 252