AngularJS Allow-Origin to WebApi2

Question

I want to host my API on a separate domain. I have configured my auth-interceptor for token in angular with a bearer:

config.headers.Authorization = 'Bearer ' + sessionStorage.getItem('token');

In my My WebApi2 I have configured the WebApiConfig with cors.

var cors = new EnableCorsAttribute("http://mydomain.com", "*", "*");
config.EnableCors(cors);

And in web.config of the API I also included:

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

I still can´t access the api due to origin not allowed. Can I add something more in my header of the auth-interceptor in angular or what do I need to do?

Jayoti Parkash · Accepted Answer · 2018-01-30 11:51:47Z

In web.config of API, include the below mentioned code:

<system.webServer>    
    <httpProtocol>
          <customHeaders>
            <remove name="X-Powered-By" />
            <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
          </customHeaders>
        </httpProtocol>
 <handlers>
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <remove name="WebDAV" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
    </handlers>
     </system.webServer>

I hope this helps.

Thanks.

wilver · Accepted Answer · 2014-04-10 23:12:09Z

1

your Angular.js interceptor settings are ok. I've got a public project with your same scenario, with OAuth+Owin authentication. The steps I followed are:

Installation of Microsoft.Owin.Cors library
Creation of custom section config to enable/config CORS
Creation of custom CORS Policy class (with the origins to enable)
Setup of CORS policy depending on configurations

Hope this helps

answered Apr 10, 2014 at 23:12

wilver

2,1161 gold badge21 silver badges26 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 12:13:14Z

0

I've had the same issue before and what worked for me was to remove the settings from the web.config and just leave the configuration settings in the WebApiConfig class

See this answer for more details

edited May 23, 2017 at 12:13

CommunityBot

11 silver badge

answered Apr 10, 2014 at 23:15

link64

1,9661 gold badge26 silver badges43 bronze badges

Collectives™ on Stack Overflow

AngularJS Allow-Origin to WebApi2

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related