Access-Control-Allow-Origin when calling WCF REST Service from jQuery and JSON

Question

I have the following code.

WCF REST method

    [WebInvoke(Method = "GET",
        ResponseFormat = WebMessageFormat.Json,
        BodyStyle = WebMessageBodyStyle.Wrapped,
        UriTemplate = "Account")]
    [OperationContract]
    string GetUniqueLoginId();

Client Side Call

$.ajax({
    type: "GET",
    url: serviceURL + 'Account',
    contentType: 'application/json; charset=utf-8',
    dataType: "json",
    success: app.onGetUniqueId,
    error: app.onAjaxError
 });

When I use IE (11), it works perfectly by returning a unique id. But when I use chrome, it gives me the following error.

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin   'http://localhost:5553' is therefore not allowed access.

How to resolve the issue? Any help would be appreciated.

score 1 · Answer 1 · edited May 23 '17 at 12:22

1

It means that the WCF service you request is in a different origin than the application which invokes it, and hence restricted by "Same Origin policy" .You will have to use JSONP( for which the service has to support jsonp) or CORS ( the server side should add the CORS headers allowing your origin)

edited May 23 '17 at 12:22

Community

1
1

answered Dec 14 '13 at 20:30

Saranya

1,988
16
20

score 1 · Answer 2 · answered Apr 17 '15 at 19:15

You need to enable CORS on a service hosted on IIS or IIS Express by adding the following configuration in the web config file.

<system.webServer>  

<httpProtocol>  
  <customHeaders>  
    <add name="Access-Control-Allow-Origin" value="*" />  
  </customHeaders>  
</httpProtocol>
 ...

By setting it to *, we are allowing requests from any origin to access the service.

Access-Control-Allow-Origin when calling WCF REST Service from jQuery and JSON

2 Answers2