Google Social Login with Web3Auth

Guide

Using Google Login with Web3Auth

Create a Google app

1. Follow Google’s instructions to set up an OAuth 2.0 app.

2. Paste the following URI as a redirect URI into the "Authorized redirect URIs" field.

   • https://auth.web3auth.io/auth

   

3. Obtain the OAuth Client ID from your App on the Google Developer dashboard

Create a Google verifier

• Go to the Web3Auth dashboard and select your project. Click on the Custom Authentication tab, then click on the Create Verifier button to create a new verifier.

  

1. Create a verifier for your Google application by first clicking on Social Login Provider and then selecting Google as the Login provider from the dropdown list.

   

2. Paste the Client ID from the Google App(above) to the Client ID field and click on Create.

   

   note

   Google Client ID is the OAuth Client ID obtained from the Google Developer dashboard and it's a required field.

Example

Modal SDK

import { AuthAdapter } from "@web3auth/auth-adapter";

// Create AuthAdapter instance once you have created Web3Auth instance
const authAdapter = new AuthAdapter({
  adapterSettings: {
    loginConfig: {
      // Google login
      google: {
        verifier: "w3a-google-demo", // Pass the Verifier name here
        typeOfLogin: "google", // Pass on the login provider of the verifier you've created
        clientId: "519228911939-cri01h55lsjbsia1k7ll6qpalrus75ps.apps.googleusercontent.com", // Pass on the Google `Client ID` here
      },
    },
  },
});

// Configure the adapter with Web3Auth
web3authInstance.configureAdapter(authAdapter);

// Initialize Modal
await web3authInstance.initModal();

// Login with Google
await web3authInstance.connect();

No Modal SDK

import { AuthAdapter } from "@web3auth/auth-adapter";

// Create AuthAdapter instance once you have created Web3AuthNoModal instance
const authAdapter = new AuthAdapter({
  adapterSettings: {
    uxMode: "redirect",
    loginConfig: {
      google: {
        verifier: "w3a-google-demo",
        // Pass the Verifier name here
        typeOfLogin: "google", // Pass on the login provider of the verifier you've created
        clientId: "519228911939-cri01h55lsjbsia1k7ll6qpalrus75ps.apps.googleusercontent.com", // Pass on the Google `Client ID` here },
      },
    },
  },
});

// Configure the adapter with Web3AuthNoModal
web3authNoModalInstance.configureAdapter(authAdapter);

// Initialize
await web3authNoModalInstance.init();

// Login with Google
await web3authNoModalInstance.connectTo(WALLET_ADAPTERS.AUTH, { loginProvider: "google" });