react 谷歌登录和facebook登录

react 谷歌登录和facebook登录

1，谷歌登录 使用react-google-login插件

import {GoogleLogin} from 'react-google-login';

let responseGoogle = (res) => {
        let {sendToken} = props
        sendToken(res.Cc.id_token)
        setLoad(false)
    }
let responseGoogleErr = (data) => {
        if (data.error === 'popup_closed_by_user') {
            console.log('用户手动关闭google登录弹窗')
        }
        if (data.error === 'network_error') {
       console.log('网络错误提示')
            FJMessageStore.addMessage(FJLocalStore._('network-error'), 'error');
        }
    }
let _onAutoLoadFinished = (data) => {
         console.log('谷歌登录sdk加载完成  会执行此方法  可用作判断是否sdk加载成功')
    }
<GoogleLogin
     clientId=项目clientId
     buttonText="Login"
     render={renderProps => (
         <button onClick={renderProps.onClick}>点击登录</button>
      )}
     onSuccess={responseGoogle}
     onFailure={responseGoogleErr}
     onAutoLoadFinished={_onAutoLoadFinished}
     cookiePolicy='single_host_origin'
     isSignedIn={false}
/>

2，facebook登录 使用react-facebook 插件

import {FacebookProvider, Login} from 'react-facebook';


let handleResponse = (res) => {
       console.log('将 res.tokenDetail.accessToken 传递给后台')
    }
let handleError = (err) => {
        let errData = {err}
        console.log(errData.err.message, 'errData.err')
        if (errData.err.message === 'Unauthorized user') {
            console.log('用户手动关闭facebook登录弹窗')
        } else if (errData.err.message === 'Facebook is not initialized. Wait for isReady') {
           console.log('sdk还未加载成功')
        }
    }

<FacebookProvider appId=项目aapId>
   <Login
      scope="email"
      onCompleted={handleResponse}
      onError={handleError}
    >
     {/* {loading, handleClick, error, data} */}
     {({loading, handleClick, error, data}) => {
         return (
             <button onClick={handleClick}>点击登录</button>
      }}
     </Login>
</FacebookProvider>