Google OAuth2 遇到问题（应用程序没有后端，所以只有客户端）

Question

我正在尝试使用 OAuth 实现仅客户端登录。出现以下错误：

details: "You have created a new client application that uses libraries for user authentication or authorization that will soon be deprecated. New clients must use the new libraries instead; existing clients must also migrate before these libraries are deprecated. See the [Migration Guide](https://developers.google.com/identity/gsi/web/guides/gis-migration) for more information."
error: "idpiframe_initialization_failed"

之后，每当我尝试登录时，都会收到以下错误：

error: "popup_closed_by_user"
[[Prototype]]: Object

现在我正在 localhost:3000 上工作，所以我在 OAuth 2.0 客户端 ID 中添加了 http://localhost:3000 作为授权的 JS 来源，还尝试将发布状态从测试更改为生产。用户类型设置为外部。

Answer 1

默认情况下，新创建的客户端 ID 现在被阻止使用旧的平台库，现有的客户端 ID 不受影响。 2022 年 7 月 29 日之前创建的新客户端 ID 可以设置 plugin_name 以启用 Google 平台库。

因此，就我而言，解决方案是：

window.gapi.load('client:auth2', () => {
            window.gapi.client.init({
                clientId: '******.apps.googleusercontent.com',
                plugin_name: "chat"
            })

Answer 2

我有同样的错误，但在 React 应用程序中。有解决办法

import React, { useEffect } from 'react';
import { GoogleLogin, GoogleLogout } from 'react-google-login';
import env from 'react-dotenv';
import { gapi } from 'gapi- script';

function AuthPage() {  
  useEffect(() => {
    function start() {
      gapi.client.init({
        clientId: env.REACT_PUBLIC_GOOGLE_CLIENT_ID,
        scope: 'email',
      });
    }

    gapi.load('client:auth2', start);
  }, []);


  // **you can access the token like this**
  // const accessToken = gapi.auth.getToken().access_token;
  // console.log(accessToken);

  const onSuccess = response => {
    console.log('SUCCESS', response);
  };
  const onFailure = response => {
    console.log('FAILED', response);
  };
  const onLogoutSuccess = () => {
    console.log('SUCESS LOG OUT');
  };

  return (
    <div>
      <GoogleLogin
        clientId={env.REACT_PUBLIC_GOOGLE_CLIENT_ID}
        onSuccess={onSuccess}
        onFailure={onFailure}
      />
      <GoogleLogout
        clientId={env.REACT_PUBLIC_GOOGLE_CLIENT_ID}
        onLogoutSuccess={onLogoutSuccess}
      />
    </div>
  );
}

export default AuthPage;

Google OAuth2 遇到问题（应用程序没有后端，所以只有客户端）

Having a trouble with Google OAuth2 (app has no backend, so client side only)

javascript

google-oauth