Login using the new Google Authentication SDK
npm install google-login-reactGoogle Login using the new Google Authentication SDK
``sh
$ npm install google-login-react
$ yarn add google-login-react
`
`jsx
import { GoogleLogin } from 'google-login-react-ts';
const App = () => {
return (
onSuccess={(res) => console.log(res)}
onError={(err) => console.log(err)}
/>
);
}
`
`jsx
import { GoogleLogin } from 'google-signin-react-ts';
const App = () => {
return (
onSuccess={(res) => console.log(res)}
onError={(err) => console.log(err)}
containerClass="
>
)
}
`
`jsx
import { GoogleLogin } from 'google-signin-react-ts';
const App = () => {
return (
onSuccess={(res) => console.log(res)}
onError={(err) => console.log(err)}
containerClass="
render={(renderProps) => (
)}
/>
)
}
`
| Required | Property | Type | Description |
| :--------: | ------------------- | ---------- | --------------------------------------------------------------------------- |
| ✅ | clientId | string | Google Project Client ID |boolean
|| containerClass | | Container className |(response: GoogleResponse) => void
| ✅ | onSuccess | | Callback fires after successful login |(response: Error) => void
|| onError | | Callback fires after unsuccessful login |string
|| scope | | Google scopes |element
|| children | | Element that replaces default button |({ onClick }) => void
|| render | | Render JSX Element passing onClick function |string
|| userInfoFetchURL | \| default | URL to retrive Google User info |
`json`
{
"email": "...",
"email_verified": "...",
"family_name": "...",
"given_name": "...",
"locale": "...",
"name": "...",
"picture": "...",
"sub": "..."
}
| Property | Type | Description |
| ------------------- | ---------- | --------------------------------------------------------------------------- |
| email | string | Google user email|boolean
| email_verified | | Google user email is verified |string
| family_name | | Google user family name |string
| given_name | | Google user given name |string
| locale | | Google user locale |string
| name | | Google user name |string
| picture | | Google user picture URL |string` | Google user sub ID |
| sub |