Having a trouble with Google OAuth2. Can't sign up with google

Question

Been facing this issue "You have created a new client application that uses libraries for user authentication or authorization that will soon be deprecated. New clients must use the new libraries instead; existing clients must also migrate before these libraries are deprecated. See the Migration Guide for more information." How to sign in with google now if they have block client ID for new users

Answer 1

as google will deprecate their old sign in library https://developers.googleblog.com/2021/08/gsi-jsweb-deprecation.html

you can now implement their new google service identity SDK https://developers.google.com/identity/gsi/web

or if you are using react, I made a small package https://www.npmjs.com/package/@react-oauth/google it is using the new SDK

Answer 2

I was having this issue and solved it using this answer

import React, { useEffect } from 'react';
import { GoogleLogin, GoogleLogout } from 'react-google-login';
import env from 'react-dotenv';
import { gapi } from 'gapi- script';

function AuthPage() {  
  useEffect(() => {
    function start() {
      gapi.client.init({
        clientId: env.REACT_PUBLIC_GOOGLE_CLIENT_ID,
        scope: 'email',
      });
    }

    gapi.load('client:auth2', start);
  }, []);


  // **you can access the token like this**
  // const accessToken = gapi.auth.getToken().access_token;
  // console.log(accessToken);

  const onSuccess = response => {
    console.log('SUCCESS', response);
  };
  const onFailure = response => {
    console.log('FAILED', response);
  };
  const onLogoutSuccess = () => {
    console.log('SUCESS LOG OUT');
  };

  return (
    <div>
      <GoogleLogin
        clientId={env.REACT_PUBLIC_GOOGLE_CLIENT_ID}
        onSuccess={onSuccess}
        onFailure={onFailure}
      />
      <GoogleLogout
        clientId={env.REACT_PUBLIC_GOOGLE_CLIENT_ID}
        onLogoutSuccess={onLogoutSuccess}
      />
    </div>
  );
}

export default AuthPage;

Answer 3

For angular developers, a repository with an example of how to use the new google sign in: https://github.com/ShemiNechmad/GoogleSignInAngular

Check the readme.md file for instructions.

Answer 4

I've faced the same issue, like you.

This is how I solved it in my React Application. https://stackoverflow.com/a/72944782/15145736

it will solve the problem