获取 "Realm didn't match redirect_uri/origin. Error code: 2"

Question

当我尝试登录时，登录 window 按预期弹出，但它给了我这个错误。

Error: invalid_request
Realm didn't match redirect_uri/origin. Error code: 2

Request Details:

openid.realm=localhost:8080/oauth2callback
scope=email profile openid https://www.googleapis.com/auth/userinfo.email
response_type=permission
redirect_uri=storagerelay://http/localhost:8080?id=auth435566
ss_domain=http://localhost:8080
client_id=SOME_STRING_ID.apps.googleusercontent.com
fetch_basic_profile=true

我通读了 Open ID 2.0 documentation，根据我的理解，属性 openid.realm 应该与我的重定向 uri 之一相同。

这是我的 "Authorized redirect URIs" 来自开发者控制台的凭据部分：

https://myapp-1234.appspot.com/oauth2callback
http://myapp-1234.appspot.com/oauth2callback
http://localhost:8080/oauth2callback

我将 openid.realm 设置为 localhost:8080/oauth2callback 因为目前我只是在测试我的应用程序，但我已经在部署中尝试了其他应用程序，但我仍然得到相同的结果，但错误代码不同.

这里是我调用 signIn() 方法的地方：

var authConfig = {
    client_id: 'SOME_STRING_ID.apps.googleusercontent.com',
    cookie_policy: 'single_host_origin',
    scope: 'https://www.googleapis.com/auth/userinfo.email profile',
    openid_realm: 'localhost:8080/oauth2callback'
}

window.handleGoogleClientLoad = function () {
gapi.client.load('myapp_endpoints', 'v1', null, '//' + window.location.host + '/_ah/api');
console.log('API LOADED');
}

//=====================================================================================

function authorizeUser() {
    gapi.load('auth2', function() {
        gapi.auth2.init(authConfig)
            .then(function() {
                var auth2 = gapi.auth2.getAuthInstance();
                var user = auth2.signIn();
                console.log(user);
        });
    });
}

module.exports = {
    login: authorizeUser
}

这里是index.html

<!DOCTYPE html>
<head>
<meta charset="utf-8">
    <title>My App</title>
</head>

<body>
    <div id="root"></div>
    <script src="lib/vendors.js"></script>
    <script src="build/bundle.js"></script>
</body>

Answer 1

问题是我使用了错误的 Google API 库。我使用的是您从 npm 获得的库。然后我导入了模块。

import GoogleApis from 'googleapis'

我本来打算做的是使用可以从他们自己下载的库 website. Integrating 这足够方便了。您所要做的就是将下面的代码行添加到您的 index.html。

<script src="https://apis.google.com/js/platform.js" async defer></script>

文件应该如下所示

<!DOCTYPE html>
<head>
<meta charset="utf-8">
    <title>Welcome to MyApp</title>
</head>

<body>
    <div id="root"></div>
    <script src="lib/vendors.js"></script>
    <script src="build/bundle.js"></script>
    <script src="https://apis.google.com/js/platform.js?onload=init" async defer></script> 
    <!-- init is the function that will get invoked when the page loads. -->
</body>

然后我改变了我的 javascript。您可以从他们的 code examples.

中找到这些更改的参考资料

const authConfig = {
    client_id: 'my_app.apps.googleusercontent.com',
    cookie_policy: 'single_host_origin',
    scope: 'https://www.googleapis.com/auth/userinfo.email profile',
    fetch_basic_profile: true
}

window.init = function() {
    gapi.load('auth2', function() {
        var auth2 = gapi.auth2.init(authConfig);
        auth2.signIn().then(function() {
            if(auth2.isSignedIn.get()) {
                var profile = auth2.currentUser.get().getBasicProfile();

                console.log('ID: ' + profile.getId());
                console.log('Full Name: ' + profile.getName());
                console.log('Email: ' + profile.getEmail());
            }
        });
    });
}

Answer 2

openid.realm=response_type=许可。

id_token

redirect_uri=storagerelay://https/www.zillow.com?id=auth807591 ss_domain=https://www.zillow.com

client_id=238648973530.apps.googleusercontent.com

fetch_basic_profile=真

gsiwebsdk=

access_type=在线

scope=https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile openid

获取 "Realm didn't match redirect_uri/origin. Error code: 2"

Getting "Realm didn't match redirect_uri/origin. Error code: 2"

openid

google-openid

google-api-java-client

openid-connect