reactjs - 错误 : idpiframe_initialization_failed while implementing OAuth 2. 0

标签 reactjs google-chrome authentication oauth-2.0

我在 Web 应用程序中使用 OAuth 2.0 时收到此错误。我正在 React 中构建我的应用程序。我还创建了 OAuth 客户端 ID。我使用的是 Google Chrome 浏览器:

{error: 'idpiframe_initialization_failed', details: 'You have created a new client application that use…i/web/guides/gis-migration) for more information.'}

下面是我在基于 React 的 Web 应用程序中的 Google Auth 代码:

import React from 'react';

class GoogleAuth extends React.Component {
    state = { isSignedIn: null };
     
     componentDidMount() {
         window.gapi.load('client:auth2', () => {
             window.gapi.client.init({
                 clientId: '716075642837-kergfh0638hu8iq5dimpgnlc1f08s61r.apps.googleusercontent.com',
                 scope: 'email'
             }).then(() => {
                 this.auth = window.gapi.auth2.getAuthInstance();
                 this.setState({isSignedIn: this.auth.isSignedIn.get()})
             });
         });
     }
     
     renderAuthButton() {
         if(this.state.isSignedIn === null) {
             return <div> I don't know if we are signed in </div>;
         } else if(this.state.isSignedIn) {
             return <div>I am signed in</div>
         } else {
             return <div>I am not signed in</div>
         }
     }
     
    render() {
        return <div> {this.renderAuthButton() } </div>;
    }
}

export default GoogleAuth;

最佳答案

您必须在范围后添加plugin_name

         window.gapi.load('client:auth2', () => {
             window.gapi.client.init({
                 clientId: '716075642837-kergfh0638hu8iq5dimpgnlc1f08s61r.apps.googleusercontent.com',
                 scope: 'email',
                 **plugin_name: 'streamy'**
             }).then(() => {
                 this.auth = window.gapi.auth2.getAuthInstance();
                 this.setState({isSignedIn: this.auth.isSignedIn.get()})
             });
         });
     }```

关于reactjs - 错误 : idpiframe_initialization_failed while implementing OAuth 2. 0,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/72169426/

相关文章:

javascript - Chrome 阻止其他对话框? Javascript 操作?

google-chrome - PDF文档文本在IE/Firefox/Chrome浏览器中的显示方式有所不同

c++ - 如何在带有密码身份验证的 linux 中以 root 身份使用 C 或 C++ 运行没有 pam 的命令

codeigniter - REST API登录方式

javascript - 如何使用react以正确呈现可移动输入的列表?

javascript - 改变状态的函数的 Redux 词

html - 浏览器兼容性 - DIV 在 Chrome 和 FF 中不同

c# - 使用 C# 的原始 FTP SSL

css - ReactJS Material UI - 设置 TextField 的悬停边框颜色的问题

javascript - 如何通过在主 div 上创建滚动条来修复全屏覆盖