Open Closed

Google auth with OpenIddict #6686


User avatar
0
duong1453 created

Check the docs before asking a question: https://docs.abp.io/en/commercial/latest/ Check the samples to see the basic tasks: https://docs.abp.io/en/commercial/latest/samples/index The exact solution to your question may have been answered before, and please first use the search on the homepage. Provide us with the following info:

  • ABP Framework version: v8.0.3
  • UI Type: Blazor Server
  • Database System: EF Core PostgreSQL)
  • Tiered (for MVC) or Auth Server Separated (for Angular): yes
  • Exception message and full stack trace:
  • Steps to reproduce the issue:

Hello,

We're trying to setup social logins (Google, Apple) for our mobile app (React native). We already managed to setup social logins for Blazor UI but apparently it's not usable for mobile, as the /signin-google endpoint used by ASP.NET Core identity expects cookie in API call, which is not possible to provide in mobile native app, so we would like to use OpenIddict - we've already managed to set up password login flow without issues. We've done some research and apparently OpenIddict supports client mode for social logins, but we're not sure if this the right way to use it https://kevinchalet.com/2022/12/16/getting-started-with-the-openiddict-web-providers/ Can you please advise on how to proceed?

Regards, Cuong Tuan Duong


7 Answer(s)
  • User Avatar
    0
    Anjali_Musmade created
    Support Team Support Team Member

    Hello,

    please check if it helps you https://support.abp.io/QA/Questions/2103/React-Native-External-Login-Approach

    thanks

  • User Avatar
    0
    duong1453 created

    Hello,

    please check if it helps you https://support.abp.io/QA/Questions/2103/React-Native-External-Login-Approach

    thanks

    Hi, unfortunately this doesn't help for multiple reasons:

    1. We're trying to keep the flow native - no ABP login screen, only social login with consent
    2. The alternative solutions are for IdentityServer, but we're using OpenIddict which is currently shipped with ABP.
  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi @duong1453

    There is no essential difference between identity server and openiddict. Can your code work in identity server? Please share some code, thanks

  • User Avatar
    0
    duong1453 created

    We're currently using default Login.cshtml and Login.cshtml.cs pages from ABP Blazor Account module. We use Microsoft.AspNetCore.Authentication.Google for Google auth

    context.Services.AddAuthentication()
                .AddGoogle(GoogleDefaults.AuthenticationScheme, options =>
                {
                    options.ClaimActions.MapJsonKey(AbpClaimTypes.Picture, "picture");
                })
                .WithDynamicOptions<GoogleOptions, GoogleHandler>(
                    GoogleDefaults.AuthenticationScheme,
                    options =>
                    {
                        options.WithProperty(x => x.ClientId);
                        options.WithProperty(x => x.ClientSecret, isSecret: true);
                    }
                )
    

    For regular Blazor UI login this works well, but we're not really sure how to approach the native mobile login.

    Our proposed flow was this:

    1. Mobile app calls ABP server which then redirects to Google with proper Authentication scheme (This is handled in Blazor UI with OnPostExternalLogin() - is it reusable for mobile login as well?
    2. User authenticates in Google and gets redirected to https://www.ourabpserver.com/signin-google
    3. ASP.NET Core Identity verifies the authorization code and OpenIddict generates a refresh/access token for mobile app

    We ran into several issues:

    1. Blazor UI generates the CSRF cookie/token pair but how to do it in mobile app?
    2. /signin-google endpoint expects the CSRF cookie/token pair otherwise the flow fails
    3. ASP.NET Core Identity generates a authentication cookie which bypasses the need for OpenIddict in this case, but it's not usable for mobile API calls

    So if I'm not wrong, the correct flow should be this

    1. Call custom OpenIddict endpoint which redirects without the CSRF cookie/token pair
    2. User authenticates in Google and gets redirected to custom external login handler
    3. OpenIddict verifies the authorazion code and generates a refresh/access token for mobile app

    We've unfortunately haven't found any code examples for this flow, especially how to handle external logins with OpenIddict in ABP and how to generate tokens for the user.

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    Your mobile app should open a built-in browser to complete the authentication. then the cookies will work on the browser.

    eg https://fusionauth.io/blog/securing-react-native-with-oauth

  • User Avatar
    0
    duong1453 created

    We've managed to bypass the native Blazor login screen using OpenIddict WebProviders support and creating a custom callback handler which redirects user to /connect/authorize endpoint with proper credentials.

            context.Services.AddOpenIddict()
                .AddClient(options =>
                {
                    options.UseWebProviders()
                        .AddGoogle(options =>
                        {
                            options.SetClientId("xxxxx")
                                .SetClientSecret("xxxxx")
                                .SetRedirectUri("callback/login/google");
                            options.AddScopes("email", "profile");
                        })
                });
    

    However this removes the ability to sign in through Blazor login page as you cannot have duplicate Google login settings with context.Services.AddAuthentication().AddGoogle(). Would it be solved with using OpenIddictSupportedLoginModel as base class in overridden Login.cshtml.cs instead of LoginModel ?

  • User Avatar
    0
    maliming created
    Support Team Fullstack Developer

    hi

    I think it's possible., You can override it to try.

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11