The problem at it's most basic is this:
My '/api/users/githublogin' endpoint works fine if requested by a regular GET from the browser, or a regular GET from Postman. However, XHR, fetch, and axios all throw the same error:
Access to fetch at 'https://github.com/login/oauth/authorize?etc' (redirected from 'https://localhost:5001/api/users/githublogin') from origin 'https://localhost:5001' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
There are a couple of related questions out there, more related to Angular than React but the problem seems the same:
Enable CORS in ASP .NET Core 2.1 Web Api
No 'Access-Control-Allow-Origin' header is present. XmlHttpRequest
.NET CORE 2.0 Angular 5: Allowing Cors
Local Javascript Fetch Post Request Fails with call to ASP.NET Core 2.2 Web API. CORS is enabaled
I have implemented their answers without success.
Here follows my server side code concerning the CORS policy:
inside the ConfigureServices method:
services.AddCors();
inside the Configure method:
app.UseCors(x => x
.AllowAnyHeader()
.AllowAnyMethod()
.AllowAnyOrigin()
.AllowCredentials());
on my client side, a button calls this code:
fetch('/api/users/githublogin');
Here follows the server log at the moment the failed request is made:
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[1]
Request starting HTTP/1.1 GET https://localhost:5001/api/users/githublogin application/json
Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request starting HTTP/1.1 GET https://localhost:5001/api/users/githublogin application/json
info: Microsoft.AspNetCore.Routing.EndpointMiddleware[0]
Executing endpoint 'web_server.Controllers.UsersController.GitHubLogin (web-server)'
Microsoft.AspNetCore.Routing.EndpointMiddleware:Information: Executing endpoint 'web_server.Controllers.UsersController.GitHubLogin (web-server)'
info: Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker[3]
Route matched with {action = "GitHubLogin", controller = "Users"}. Executing controller action with signature Microsoft.AspNetCore.Mvc.ActionResult GitHubLogin(System.String) on controller web_server.Controllers.UsersController (web-server).
Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker:Information: Route matched with {action = "GitHubLogin", controller = "Users"}. Executing controller action with signature Microsoft.AspNetCore.Mvc.ActionResult GitHubLogin(System.String) on controller web_server.Controllers.UsersController (web-server).
info: Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker[1]
Executing action method web_server.Controllers.UsersController.GitHubLogin (web-server) - Validation state: Valid
Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker:Information: Executing action method web_server.Controllers.UsersController.GitHubLogin (web-server) - Validation state: Valid
Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker:Information: Executed action method web_server.Controllers.UsersController.GitHubLogin (web-server), returned result Microsoft.AspNetCore.Mvc.ChallengeResult in 0.7161ms.
info: Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker[2]
Executed action method web_server.Controllers.UsersController.GitHubLogin (web-server), returned result Microsoft.AspNetCore.Mvc.ChallengeResult in 0.7161ms.
info: Microsoft.AspNetCore.Mvc.ChallengeResult[1]
Executing ChallengeResult with authentication schemes ().
Microsoft.AspNetCore.Mvc.ChallengeResult:Information: Executing ChallengeResult with authentication schemes ().
info: Microsoft.AspNetCore.Authentication.OAuth.OAuthHandler`1[[Microsoft.AspNetCore.Authentication.OAuth.OAuthOptions, Microsoft.AspNetCore.Authentication.OAuth, Version=2.2.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]][12]
AuthenticationScheme: GitHub was challenged.
Microsoft.AspNetCore.Authentication.OAuth.OAuthHandler`1[[Microsoft.AspNetCore.Authentication.OAuth.OAuthOptions, Microsoft.AspNetCore.Authentication.OAuth, Version=2.2.0.0, Culture=neutral, PublicKeyToken=adb9793829ddae60]]:Information: AuthenticationScheme: GitHub was challenged.
info: Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker[2]
Executed action web_server.Controllers.UsersController.GitHubLogin (web-server) in 76.0766ms
info: Microsoft.AspNetCore.Routing.EndpointMiddleware[1]
Executed endpoint 'web_server.Controllers.UsersController.GitHubLogin (web-server)'
Microsoft.AspNetCore.Mvc.Internal.ControllerActionInvoker:Information: Executed action web_server.Controllers.UsersController.GitHubLogin (web-server) in 76.0766ms
Microsoft.AspNetCore.Routing.EndpointMiddleware:Information: Executed endpoint 'web_server.Controllers.UsersController.GitHubLogin (web-server)'
info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
Microsoft.AspNetCore.Hosting.Internal.WebHost:Information: Request finished in 145.364ms 302
Request finished in 145.364ms 302
Nothing regarding CORS. In fact in the whole of the server log only this much mentions it:
warn: Microsoft.AspNetCore.Cors.Infrastructure.CorsService[11]
The CORS protocol does not allow specifying a wildcard (any) origin and credentials at the same time. Configure the policy by listing individual origins if credentials needs to be supported.
Microsoft.AspNetCore.Cors.Infrastructure.CorsService:Warning: The CORS protocol does not allow specifying a wildcard (any) origin and credentials at the same time. Configure the policy by listing individual origins if credentials needs to be supported.
info: Microsoft.AspNetCore.Cors.Infrastructure.CorsService[4]
CORS policy execution successful.
Microsoft.AspNetCore.Cors.Infrastructure.CorsService:Information: CORS policy execution successful.
Now, it seems to me as though my server is correctly executing the actions that it is supposed to. That 302 Found (if I'm not mistaken) is basically a signal to the client to redirect to that github endpoint. So, if my server is not throwing a CORS related exception to the request (or however that works), and in fact has an AllowAnyOrigins flag set, why is the client receiving this error? And why does it not receive it when the browser makes the GET request?
I should note that this is a development server. As encouraged by the documentation, I am using the spa.UseProxyToSpaDevelopmentServer("http://localhost:3000"); option. This is the one thing I could imagine is messing with me, seeing as technically the requests are coming from cross-origin (from port :3000 to port :5001), but I believe that it should not be a problem given the AllowAnyOrigins flag.
The api was built from a basic ASP.NET Core 2.2 webapi template. The client was built with create-react-app. They're both very boilerplate.
Could anyone help eludicate any of this?
