idpiframe_initialization_failed',详细信息:'您已经创建了一个新的客户端应用程序,使用...i/web/guides/gis-migration)以获取更多信息。'}

问题描述 投票:0回答:0

我正在尝试在我的 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 但那没有用。

reactjs google-oauth react-dom
© www.soinside.com 2019 - 2024. All rights reserved.