error: 'idpiframe_initialization_failed', details: 'You have created a new client application that use…i/web/guides/gis-migration) for more information.'} 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
CodePudding user response:
Gapi sign-in method will be deprecated by March 2023 and it will be not used.so you must go with the new method mentioned here
Update: Also you can add plugin_name to your code to bypass error like this:
window.gapi.client
.init({
clientId:'Your Client ID',
scope: "email",
plugin_name:'App Name that you used in google developer console API'
})
CodePudding user response:
check these blog https://github.com/anthonyjgrove/react-google-login/issues/502
or try these
Here is what I am using.
First I have a general hook called useScript that can load any tag into the HTML head and has a callback function for when the script fully loads:
import { useEffect } from "react";
const useScript = (url, onl oad) => {
useEffect(() => {
const script = document.createElement("script");
script.src = url;
script.onload = onl oad;
document.head.appendChild(script);
return () => {
document.head.removeChild(script);
};
}, [url, onl oad]);
};
export default useScript;
Then I have created a GoogleLogin component that loads Google's button.
import { useRef } from "react";
import useScript from "hooks/useScript";
export default function GoogleLogin({
onGoogleSignIn = () => {},
text = "signin_with",
// feel free to add more options here
}) {
const googleSignInButton = useRef(null);
useScript("https://accounts.google.com/gsi/client", () => {
window.google.accounts.id.initialize({
client_id: process.env.REACT_APP_GOOGLE_CLIENT_ID,
callback: onGoogleSignIn,
});
window.google.accounts.id.renderButton(
googleSignInButton.current,
{ theme: "outline", size: "large", text, width: "250" } // customization attributes
);
});
return <div className="test" ref={googleSignInButton}></div>;
}
Pretty straightforward!