1

I have created a SPA and used Azure AD for User store and ADAL-JavaScript library as mentioned on a http://www.cloudidentity.com/blog/2014/10/28/adal-javascript-and-angularjs-deep-dive/ to integrate with my angular js code. It did authentication flow successfully, but when I was calling the third party API exposed using APIGEE, I was getting following error messages:

Failed to load resource: the server responded with a status of 502 (Bad Gateway)

XMLHttpRequest cannot load http: //webapiexposedusingapigee. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://mywebsite.in' is therefore not allowed access. The response had HTTP status code 502.

When I checked in Fiddler i got following fault string. "faultstring=Received 405 Response without Allow Header"

and warning as :

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http:// test.apigee.net/v1/selectop/myapi. This can be fixed by moving the resource to the same domain or enabling CORS.

I had added following headers on APIGEE:

 <Header name="Access-Control-Allow-Origin">*</Header>
            <Header name="Access-Control-Allow-Credentials">true</Header>
            <Header name="Access-Control-Allow-Headers">Origin, X-Requested-With, Content-Type, Accept</Header>
            <Header name="Access-Control-Max-Age">3628800</Header>
            <Header name="Access-Control-Allow-Methods">GET, PUT, POST, DELETE, OPTION</Header>

Any help on this is appreciated.

Thanks.

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197

1 Answers1

0

If you have correct CORS setup at WebAPI endpoint, it will accept the request. I am not familiar with APIGEE, but this link lists the steps to enable:http://apigee.com/docs/api-services/content/adding-cors-support-api-proxy.

You need to specify to use xdomain to send headers in angular js:

app.factory('contactService', ['$http', function ($http) {
var serviceFactory = {};

var _getItems = function () {
    $http.defaults.useXDomain = true;
    delete $http.defaults.headers.common['X-Requested-With'];
    return $http.get('http://adaljscors.azurewebsites.net/api/contacts');
};

serviceFactory.getItems = _getItems;

return serviceFactory;

}]);

Omer Cansizoglu
  • 1,271
  • 9
  • 14