简介
react-google-login-logout 是一个基于 React 和 Google API 的开源 npm 包,它提供了一个简单易用的方式来实现与 Google OAuth2.0 授权登陆、注销功能。
安装
可以通过 npm 安装 react-google-login-logout:
--- ------- ------------------------- ------
使用
在使用之前,需要先去 Google Console 注册一个应用并获取应用的 client ID。
在应用中使用
------ ------ - --------- - ---- -------- ------ - ------------ ------------ - ---- ---------------------------- ----- --- ------- --------- - ------------------ - ------------- ---------- - - ----------- ------ ----- -- -- - ---------------------- - --------------- ----------- ----- ----- ------------------- --- - ---------------------- - ------------- ------- - -------- - --------------- ----------- ------ ----- -- --- - -------- - ------ - ----- - --------------------- - ------------- ---------------------------------------- --- ------------ --------------------------- ---------------------------------------- ---------------------------------------- -------------- ------ --- -- - - --------------------- - ---------------------------------- - ------- ------ ------- - ------ -- - - ------ ------- ----
API 说明
GoogleLogin
组件
Prop | Type | Description |
---|---|---|
clientId | string | 您从 Google 应用管理中心获取到的 client ID |
onSuccess | function | 登陆成功时的回调函数 |
onFailure | function | 登陆失败时的回调函数 |
offline | bool | 是否使用授权码流 |
scope | string | 请求的权限范围 |
redirectUri | string | 授权成功后的回调地址 |
cookiePolicy | string | cookie 策略 |
responseType | string | 响应类型 |
accessType | string | 确定是否需要每次都重新显示用户选择的帐户 |
isSignedIn | bool | 判断授权状态是否与应用内部状态一致 |
fetchBasicProfile | bool | 控制是否尝试从 Google 获取额外的一些用户信息 |
render | function | 可以进一步自定义该按钮的呈现方式 |
buttonText | string | 按钮上的文本 |
GoogleLogout
组件
Prop | Type | Description |
---|---|---|
onLogoutSuccess | function | 注销成功时的回调函数 |
render | function | 可以进一步自定义该按钮的呈现方式 |
buttonText | string | 按钮上的文本 |
总结
使用 react-google-login-logout,我们可以简单而方便地实现 Google OAuth2.0 登陆和注销功能。通过本文的介绍,相信大家对于如何使用该 npm 包已经有一定的了解,在后续的项目中可以直接应用。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/600562f281e8991b448e0acf