反应Google登录 [英] React Google Login

问题描述

我正在使用 react-google-login ( https ://www.npmjs.com/package/react-google-login )工具进行登录，以为我的应用程序提供Google登录功能.按照页面上的手册，我最终使用以下代码.

I am using react-google-login (https://www.npmjs.com/package/react-google-login) tool to login to provide Google login functionality for my application. Following the manual on page I ended up using following code.

<GoogleLogin
   clientId="xxx.apps.googleusercontent.com"
   onSuccess={this.responseGoogle.bind(this)}
   onFailure={this.responseGoogle.bind(this)}
   tag={'span'}
   className={"google-button-wrapper"}
   >
   <Button id={'google-button'} basic
      color='google plus'>
      <Icon name='google plus'/>
      Google Plus
   </Button>
</GoogleLogin>

问题在于，即使不单击按钮也将触发登录操作.刷新页面后会发生这种情况.

The problem is that the login action is triggered even without clicking the button. This happens after refresh page.

我发现了以下可疑情况:

I found following suspicious scenarios:

刷新页面->打开登录页面=已触发

Refresh page -> open Login page = Triggered

刷新页面->打开登录页面->打开其他网站->再次登录=第一次触发，第二次没有触发.

Refresh page -> open Login page -> Open different site -> Login again = Triggered first time, second time no trigger.

刷新页面->打开登录页面->打开注册页面=在登录页面上触发，即使有相同的代码片段也不会在注册页面上触发.

Refresh page -> open Login page -> open Registration Page = Trigger on Login page, not trigger on Register page even if there is same snipped of code.

我正在使用React v ^ 16.3.2， 有什么想法吗?

I am using React v ^16.3.2, Any ideas?

推荐答案

尝试在onSuccess和onFailure内部使用箭头函数，不要在此处绑定它们.最好在构造函数上绑定函数

try to use arrow functions inside onSuccess and onFailure and don't bind them here. It is better practice to bind functions on constructor

这篇关于反应Google登录的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！