我正在尝试使用React整合Google登录 (链接)。
我找到了一个以前解决这个问题的问题Using google sign in button with react 2。
我复制了相同的步骤。在我的index.html
中,我执行以下操作
<script src="https://apis.google.com/js/platform.js?onload=triggerGoogleLoaded" async defer></script>
<script type="text/javascript">
function triggerGoogleLoaded() {
console.log("google event loaded");
window.dispatchEvent(new Event('google-loaded'));
}
</script>
那么我的Component
看起来像这样
var LoginButton = React.createClass({
onSignIn: function(googleUser) {
console.log("user signed in"); // plus any other logic here
},
renderGoogleLoginButton: function() {
console.log('rendering google signin button');
gapi.signin2.render('my-signin2', {
'scope': 'https://www.googleapis.com/auth/plus.login',
'width': 200,
'height': 50,
'longtitle': true,
'theme': 'light',
'onsuccess': this.onSignIn
})
},
componentDidMount: function() {
window.addEventListener('google-loaded',this.renderGoogleLoginButton);
},
render: function() {
let displayText = "Sign in with Google";
return (
<div class="g-signin2" data-onsuccess="onSignIn"></div>
);
}
});
export default LoginButton;
当我使用yarn start
运行程序时,我遇到了
/Users/Harit.Himanshu/bl/sources/webs/google-login/src/LoginButton.js
11:9 error 'gapi' is not defined no-undef
26:13 warning 'displayText' is assigned a value but never used no-unused-vars
✖ 2 problems (1 error, 1 warning)
完整的源代码可以在https://github.com/hhimanshu/google-login-with-react找到。
能有人帮我理解我的错误吗?
谢谢