Skip to content

Google

In this guide, you will learn how to enable Google authentication and onboard dApp users.

Prerequisites

Note that some steps are performed using Google Console, and others using Arcana Dashboard. After that simply integrate your dApp with the Arcana Auth SDK to trigger Google login and onboard users.

To enable social authentication via Google in the Web3 applications, developers must perform these three steps before integrating with the Arcana Auth SDK.

Step 1: Use Arcana Dashboard

Go to the Arcana Dashboard: https://dashboard.arcana.network

Register your dApp by creating a new dApp entry and specifying a name using the 'Create New App' wizard.

Registering the Application

If you have already registered your dApp using Arcana Dashboard and obtained an Client ID, you may skip this step.

You can use defaults for other settings or change them as per your use case. Refer to the how to configure dApp guide for details.

Go to the Configure->Social Auth configuration section and copy the redirect URI value displayed there. This will be used in the next step to generate Google Client ID.

redirect_page

Do not close the dashboard browser tab. Open another tab and continue with the next step. Then come back to the Dashboard tab and complete Google Client ID settings.

Step 2: Use Google Developer Console

Go to the Google Cloud Console. Create a new OAuth 2.0 credential for your dApp.

google_console_redirect

In the Google Cloud Console, select the option to set up credentials for a web application.

Google OAuth ClientID create

Specify the redirect URI value to the one that you saved in the previous step from the Auth tab of the Arcana Network Dashboard.

Redirect URI

The redirect URI refers to the endpoint to which the Google OAuth 2.0 server can send authentication responses. These endpoints must adhere to Google’s validation rules.

Complete the steps in Google Cloud Console for creating a new OAuth 2.0 credential. It will generate a unique ClientID.

Google OAuth ClientID copy

Save the Client ID assigned by Google. It will be required in the next step.

Step 3: Update Arcana Dashboard

Revisit the Arcana Developer Dashboard portal. Click on your app entry and visit the application dashboard. Click Configure->Social Auth in the LHS navigation bar. Refer to the "Google" settings and paste the Client ID assigned by Google Cloud Console in the previous step.

howto_google_auth_type

Save the settings on the dashboard. Arcana Network assigns an Client ID to every registered and configured dApp. If you plan to integrate with Arcana SDKs, you need to save this Client ID.

App Identifier

You are all set with the Google configuration. Integrate the Web3 application with the Arcana Auth SDK and call the user onboarding function when the user chooses to log in.

Tip

The Client ID is displayed on the top right of your dashboard.

You can revisit the Arcana Dashboard later to view and modify configuration settings.

Step 4: Integrate and Use Arcana Auth SDK

Use instructions here to integrate your application with the Arcana Auth SDK. After integration, use the following code to trigger Google login to onboard users:

await auth.loginWithSocial('google')

Check if a user is logged in:

const connected = await auth.isLoggedIn()

Use other Auth SDK functions in your dApp. See Auth SDK Usage Guide for details.

Add code in the application to log out an authenticated user:

await auth.logout()

That is all!

Your dApp is all set for onboarding users via the Google authentication mechanism.

What's Next?

After enabling user sign-in via Google, you can allow authenticated users to access the Arcana wallet for signing blockchain transactions on any EVM-compatible network.

See also


Last update: February 21, 2023 by shaloo, shalz