5

I've created an asp.net web api 2 service with individual account security. I'm trying to call it form AngularJs as per this example: http://www.codeproject.com/Articles/742532/Using-Web-API-Individual-User-Account-plus-CORS-En could not get that to work so added some config from here: How to make CORS Authentication in WebAPI 2?

and can't get past this error: XMLHttpRequest cannot load 'serverRegisterUrl'. The 'Access-Control-Allow-Origin' header contains multiple values 'clientUrl, *, *', but only one is allowed. Origin 'clientUrl' is therefore not allowed access.

I don't understand this error message. I think that Access-Control-Allow-Origin string means allow origin clientUrl, all headers, all methods

I don't understand the problem. If I'm supposed to just specify the origin alone somewhere, I don't know where that is.

I'm running this on Microsoft Azure and using vs express for web 2013 update 2 just in case it matters.

I unfortunately had to take my links out of the error message because I need atleast reputation 10 here to post more then 2 links in a question.

4
  • in your API set Access-Control-Allow-Origin: * and it should work Commented May 13, 2014 at 22:21
  • 1
    I have this in my api web.config: Commented May 13, 2014 at 22:51
  • <httpProtocol> <customHeaders> <add name="Access-Control-Allow-Origin" value="" /> <add name="Access-Control-Allow-Methods" value="" /> </customHeaders> </httpProtocol> does not work Commented May 13, 2014 at 22:52
  • (I have an asterisk for my value) -- still trying to figure out how to post here properly Commented May 13, 2014 at 22:55

3 Answers 3

10

I got it working, I think it came down to configuration. Web.config: no "Access-Control-Allow-Origin" customHeaders node

Startup.Auth.cs:
// This must come first to intercept the /Token requests app.UseCors(CorsOptions.AllowAll);

// Enable the application to use bearer tokens to authenticate users app.UseOAuthBearerTokens(OAuthOptions);

WebApiConfig.cs: (not enabling cors here) //var cors = new EnableCorsAttribute("*", "*", "*"); //config.EnableCors(cors);

AccountController.cs: attribute on GetExternalLogin method: [EnableCors(origins: "*", headers: "*", methods: "*")]


I think that's my whole current CORS config.

Sign up to request clarification or add additional context in comments.

Comments

5

Just adding to @AlexSmotritsky's answer.

To make use of the UseCors method in

app.UseCors(CorsOptions.AllowAll);

remember to install the Microsoft.Owin.Cors NuGet package and add the

using Microsoft.Owin.Cors; directive.

Comments

0

It seems that your Access-Control-Allow-Origin value was clientUrl, *, * which might be invalid. It only allows one value. You can put * means all origins are allowed, or the one you specified, for example your AngularJS host.

I had put my code at https://gist.github.com/shaunxu/8414a78cd8074432fc69 This might not be the east way but it works in my application.

2 Comments

Thank you for your code. Depending on how I configure things around it I either get: 500 (Internal Server Error) or No 'Access-Control-Allow-Origin' header is present on the requested resource. I'm going to figure out how to trace/log my service in azure as I don't know what's behind these 500 errors and I think I was generating them in some instances before I started using your class as well.
this is definitely an azure thing. my code works locally, 500 error happens in azure, will have to add error logging.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.