Written by Dhananjay Kumar

Solved Access-Control-Allow-Origin Error in WCF REST Service

 

Recently I was working on a JSON based WCF REST Service. It was a simple service performing CRUD operation. When I tried to consume service from a web based client, got following errors in browser console.

clip_image002

Error message was, No Access-Control-Allow-Origin header is present on the required resource. Since service was running on different server and it was not configured to accept request from any origin. This error can be resolved by enabling CORS: Cross Origin Resource Sharing for the service.

image

You can enable CORS on service hosted on IIS or IIS Express by adding following configuration in config file.

clip_image002[6]

We have added a custom header that allow Access-Control-Allow-Origin value to *. By setting it * , we are allowing request from any origin to access the service. So to solve error I went ahead and added following configuration in web.config of service under system.webServer section,


<system.webServer>
    
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
      </customHeaders>
    </httpProtocol>    
    
    <modules runAllManagedModulesForAllRequests="true"/>  
    <directoryBrowse enabled="true"/>
  </system.webServer>

 

After adding above configuration you should able to access service in client side codes like JavaScript. I hope this post is useful.

5 thoughts on “Solved Access-Control-Allow-Origin Error in WCF REST Service”

  1. Pingback: Dew Drop – June 12, 2014 (#1796) | Morning Dew

  2. Thanks for sharing, will this work for apache/linux hosted websites aswell?

    Ive been getting this error recently. and dont know why:

    Font from origin ‘http://www.domain.nl’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://www.domain.eu’ is therefore not allowed access. (index):1

    Could you please elaborate on this and what a possible solution could be? Thanks.

  3. Thanks for sharing, will this work for apache/linux hosted websites aswell?

    Ive been getting this error recently. and dont know why:

    Font from origin ‘http://www.domain.nl’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://www.domain.eu’ is therefore not allowed access. (index):1

    Could you please elaborate on this and what a possible solution could be? Thanks.

  5. Thank you so much for your post, I got the same error and I fixed it right the the way you did. Once again thx!

Leave a comment