I am trying to implement client side only login using OAuth. Getting the following error:
details: "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](https://developers.google.com/identity/gsi/web/guides/gis-migration) for more information."
error: "idpiframe_initialization_failed"
After that, whenever i try to sign in, i get the following error:
error: "popup_closed_by_user"
[[Prototype]]: Object
Right now i am working on localhost:3000, so i added http://localhost:3000 as authorized JS origin in OAuth 2.0 Client IDs, also tried changing publishing status from testing to production. User type is set to External.
I had the same error, but in React app. There is the solution
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;
By default, newly created Client IDs are now blocked from using the older Platform Library, existing Client IDs are unaffected. New Client IDs created before July 29th, 2022 can set plugin_name to enable use of the Google Platform Library.
So, in my case the solution was:
window.gapi.load('client:auth2', () => {
window.gapi.client.init({
clientId: '******.apps.googleusercontent.com',
plugin_name: "chat"
})