Web API backend React frontend

Ready to post? :mag: First, try searching for your answer.
I wanted to keep as little as possible on my react frontend.

builder.Services.AddAuth0WebAppAuthentication(options =>
{
options.Domain = “xxxxxxxxxxxx”;
options.ClientId = “xxxxxxxxxx”;
options.ClientSecret = “xxxxxx…”;
});;

My frontend just makes calls to Login:

 [HttpGet("login")]
 public IActionResult Login(string returnUrl = "/")
 {
     var authenticationProperties = new LoginAuthenticationPropertiesBuilder()
     .WithRedirectUri("/api/auth/callback")
     .WithScope("openid profile email")
     .Build();

     return Challenge(authenticationProperties, Auth0Constants.AuthenticationScheme);
 }

        [HttpPost("callback"), HttpGet("callback")]
        [AllowAnonymous]
        public async Task<IActionResult> Callback()
        {
            var authResult = await HttpContext.AuthenticateAsync(Auth0Constants.AuthenticationScheme);
            if (!authResult.Succeeded) return Unauthorized();

            var claims = authResult.Principal?.Identities.FirstOrDefault()?.Claims;

            
            return Redirect("reactwebapp"); 
        }

Here I just redirect back to my frontend. I’ve gotten it to work up to this point but I am fairly new to this, so I am not sure where to go from here. I basically just want my frontend to have a token that it can feed with subsequent calls and wanted to make sure that I’m even moving the right direction.

Hi @gbedford45,

Welcome to the Auth0 Community!

After successful authentication, in the authResult.Properties you can call the GetTokens() method and send the tokens you need back to the client. Any subsequent API requests that need authorization will need these tokens.

If you have any other questions feel free to ask us.

Have a good one,
Vlad

1 Like