我正在尝试在我的 React 应用程序中进行谷歌身份验证。我已经为它创建了 google api 令牌,并尝试在登录后获取数据,但出现错误。
登录.jsx
import React from 'react'
import GoogleLogin from 'react-google-login'
import { useNavigate } from 'react-router-dom'
import { FcGoogle } from 'react-icons/fc'
import Video from '../assets/share.mp4'
import logo from '../assets/logowhite.png'
const Login = () => {
const responseGoogle = (responce) => {
console.log(responce)
}
return (
<div className='flex justify-start items-center flex-col h-screen'>
<div className='relative w-full h-full'>
<video
src={Video}
type="video/mp4"
loop
controls={false}
autoPlay
muted
className="w-full h-full object-cover"
/>
<div className='absolute flex flex-col justify-center items-center top-0 bottom-0 right-0 left-0 bg-blackOverlay'>
<div className='p-5'>
<img src={logo} width="130px" alt="logo" />
</div>
<div className="shadow-2xl">
<GoogleLogin
clientId={process.env.REACT_APP_GOOGLE_API_TOKEN}
render={(renderProps) => (
<button
type='button'
className='bg-mainColor flex justify-center items-center p-3 rounded-lg cursor-pointer outline-none'
onClick={renderProps.onClick}
disabled={renderProps.disabled}>
<FcGoogle className='mr-4' />Sign in with Google
</button>
)}
onSuccess={responseGoogle}
onFailure={responseGoogle}
cookiePolicy="single_host_origin"
/>
</div>
</div>
</div>
</div>
)
}
export default Login
index.js
import React from "react";
import ReactDOM from "react-dom";
import { BrowserRouter as Router } from 'react-router-dom'
import App from './App'
import './index.css'
ReactDOM.render(
<Router>
<App />
</Router>,
document.getElementById('root')
)
我尝试了各种方法也 createRoot 但那没有用。