CODEWITHSUNDEEP
c#asp.netangularjsasp.net-web-apicors
Bob Horn
Bob Horn

Reputation: 34297

Fundamental Misunderstanding About CORS and Ajax Call

I have code that works, but I'm having a difficult time making the connection as to why it works.

I have code in an AngularJS factory function that makes this call:

$http.get('http://webServerName/PrestoWebApi/api/apps/')

And this is the Web API controller (C#):

[EnableCors(origins: "http://webServerName", headers: "*", methods: "*")]
public class AppsController : ApiController

The source of the call would be a user's computer, for example, a laptop with the name JoesLaptop. And that laptop could run anywhere. (Currently, this is all running inside one LAN, but the user could be anywhere.)

So why does specifying the web server name within the EnableCors attribute work? Isn't the request coming from the browser on Joe's laptop and not from the web server itself?

Edit

If I remove the EnableCors attribute, I get this error in the F12 tools in the browser:

XMLHttpRequest cannot load http://webServerName/PrestoWebApi/api/apps/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://webServerName' is therefore not allowed access.

Edit 2

Request:

GET http://fs-6103.fs.local/PrestoWebApi/api/apps/ HTTP/1.1
Host: fs-6103.fs.local
Connection: keep-alive
Accept: application/json, text/plain, */*
Origin: http://fs-6103
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/38.0.2125.111 Safari/537.36
Referer: http://fs-6103/PrestoWebApi/app/
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8

Response:

HTTP/1.1 200 OK
Cache-Control: no-cache
Pragma: no-cache
Content-Type: application/json; charset=utf-8
Expires: -1
Server: Microsoft-IIS/7.5
Access-Control-Allow-Origin: http://fs-6103
X-AspNet-Version: 4.0.30319
X-Powered-By: ASP.NET
Date: Fri, 31 Oct 2014 18:30:05 GMT
Content-Length: 2931171

Upvotes: 0

Views: 141

Answers (2)

Josep
Josep

Reputation: 13071

If webServerName is rendering an HTML page that is starting an asynchronous request to webServerName, then CORS doesn't apply and your server will serve that resource anyway.

I'm pretty sure that must be your case.

UPDATE

Based on the latest edits of the question and the comments that the OP has made bellow this answer, this is what must be happening.

The HTTP server that it's serving both the main HTML page and the API resource is the same, therefore there shouldn't be any need to EnableCORS. However, according to the headers of the Request the page is being served from http://fs-6103 and the $http.get is made to http://fs-6103.fs.local. That should explain everything.

UPDATE 2

Ok, I'm willing to bet that this is what's happening here:

  • The main page is being served by http://fs-6103
  • The $http.get is made towards: http://fs-6103.fs.local/

So far I'm not speculating, this is what the request is saying

The OP must have [EnableCors(origins: "http://fs-6103", headers: "*", methods: "*")] set into the API controller.

When this is disabled the OP is getting the error: No 'Access-Control-Allow-Origin' header is present on the requested resource, as it should be expected. And when the OP enables it everything works as expected.

Upvotes: 1

Bro
Bro

Reputation: 483

Browsers/clients handle the security, and generally restrict things to single origin, meaning they only accept stuff from the server they made the request to. Enabling cors in the header (ACAO) or wherever lets that server tell the browser, "hey those other Cross origin resources are with me." The browser will generally go along with that.

Upvotes: 0

Related Questions