身份工具包不起作用 - 错误代码：来自 IDP 的错误响应答案

【问题标题】：Identity Toolkit does not work - Error code: Bad response from IDP身份工具包不起作用 - 错误代码：来自 IDP 的错误响应
【发布时间】：2015-07-30 03:31:54
【问题描述】：

我目前无法解决的问题是bad response from IDP，原因应该是缺少mode=select，但我现在不知道必须实现mode=select 的页面

事实上，我已将代码添加到两个单独的页面中，第一个是 index.php，它执行以下操作：

<script type="text/javascript" src="//www.gstatic.com/authtoolkit/js/gitkit.js"></script>
<script type="text/javascript">
var config = {
apiKey: 'AIzaSyAaMAfu7S2AITODrGJzVkIYBXlZR3FYhuQ',
signInSuccessUrl: 'http://www.lascuolacheverra.org/signin?mode=select', // i tried to add the `mode=select here`
signInOptions: ["google", "password"],
idps: ["Google", "AOL", "Microsoft", "Yahoo", "Facebook"],
oobActionUrl: '/',
siteName: 'La scuola che verrà A.P.S.',
    
    // Optional - function called after sign in completes and before
    // redirecting to signInSuccessUrl. Return false to disable
    // redirect.
    // callbacks: {
    //  signInSuccess: function(tokenString, accountInfo,
    //    opt_signInSuccessUrl) {
    //      return true;
    //    }
    // },
    
    // Optional - key for query parameter that overrides
    // signInSuccessUrl value (default: 'signInSuccessUrl')
    // queryParameterForSignInSuccessUrl: 'url'
    
    // Optional - URL of site ToS (linked and req. consent for signup)
     tosUrl: 'http://www.lascuolacheverra.org/privacypolicy.html',
    
    // Optional - URL of callback page (default: current url)
    // callbackUrl: 'http://example.com/callback',
    
    // Optional - Cookie name (default: gtoken)
    //            NOTE: Also needs to be added to config of the ‘page with
    //                  sign in button’. See above
    // cookieName: ‘example_cookie’,
    
    // Optional - UI configuration for accountchooser.com
    acUiConfig: {
     title: 'Sign in to lascuolacheverra.org',
     favicon: 'http://www.lascuolacheverra.org/favicon.ico',
     branding: 'http://www.lascuolacheverra.org/images/lascuolacheverra.jpg'
     },
    
    
    // Optional - Function to send ajax POST requests to your Recover URL
    //            Intended for CSRF protection, see Advanced Topics
    //      url - URL to send the POST request to
    //     data - Raw data to include as the body of the request
    //completed - Function to call with the object that you parse from
    //            the JSON response text. {} if no response
    /*ajaxSender: function(url, data, completed) {
     },
     */
};
// The HTTP POST body should be escaped by the server to prevent XSS
window.google.identitytoolkit.start(
                                    '#gitkitWidgetDiv', // accepts any CSS selector
                                    config,
                                    '{{ POST_BODY }}');
</script>

<!-- End modification -->

代码的第二部分在另一个 index.php 中并执行以下操作：

<!DOCTYPE html>
<html>
<head>

<!-- Copy and paste here the "Sign-in button javascript" you downloaded from Developer Console as gitkit-signin-button.html -->

<script type="text/javascript" src="//www.gstatic.com/authtoolkit/js/gitkit.js"></script>
<link type=text/css rel=stylesheet href="//www.gstatic.com/authtoolkit/css/gitkit.css" />
<script type=text/javascript>
window.google.identitytoolkit.signInButton(
                                           '#navbar', // accepts any CSS selector
                                           {
                                           widgetUrl: "/widget",
                                           signOutUrl: "/",
                                           }
                                           );
</script>

<!-- End configuration -->

</head>
<body>

<!-- Include the sign in button widget with the matching 'navbar' id -->
<div id="navbar"></div>
<!-- End identity toolkit widget -->

<p>
{{ CONTENT }}
</p>
</body>
</html>

我想知道我必须如何继续才能正确使用mode=select，因为截至今天我的主页可以使用 Identity Toolkit，但由于这个错误，我无法充分使用它。

【问题讨论】：

标签： javascript html google-identity-toolkit

【解决方案1】：

您需要创建两个页面。假设 url1 和 url2。

url1，您通过运行在其中包含登录按钮：

window.google.identitytoolkit.signInButton()

将 widgetUrl 设置为 url2

在您通过运行呈现小部件的 url2 中：

window.google.identitytoolkit.start()

将 signInSuccessUrl 设置为 url1

不要将 ?mode=select 添加到小部件 url。单击登录按钮时，它会自动将其附加到该 url 并重定向到那里。

【讨论】：

我想澄清一下，我使用了两个不同的页面：模板文件夹下的 index.php，它是处理网站一般功能的主页，另外我还创建了另一个页面，始终称为index.php 在 gitkit 目录下，这就是为什么我无法理解出了什么问题，而且谷歌给我发了电子邮件，说明使用 mode=select 的重要性，当我试图询问正确使用以及如何做到这一点时，我被回答了询问你的问题在堆栈上，所以请解决我这个奇怪的问题

【解决方案2】：

signInSuccessUrl： 'http://www.lascuolacheverra.org/signin?mode=select', // 我试图添加mode=select here

这不应指向/signin 页面。也许指向/ 或/signed-in。

另外，删除

// signInOptions: ["google", "password"], //

idps：[“Google”、“AOL”、“Microsoft”、“Yahoo”、“Facebook”]，

我对此进行了一些测试，如果我添加了 signInOptions，则 idps 将被忽略，您最终只能使用 google 和密码登录。

显然只使用 signInOptions is the way to do it。我在其他示例中阅读了 idps 而不是 signInOptions，并且我成功使用了 idps。

更新我有点误读了代码。我以为\signin 是显示小部件的页面，教程放在\widget 下。我的错误是因为在我的项目中，我将\widget 替换为\secure-sign-in。因此，如果您的 \signin 页面不是 \widget 页面，那么您的代码已经可以了。在任何情况下，您都应该删除?mode=select，因为它仅用于\widget，并由window.google.identitytoolkit.signInButton 函数自动添加。

【讨论】：

我试试会告诉你
我已经删除了signInOptions但仍然无法使用，请尽快回复此评论我的朋友
与此同时，我将idps 替换为signInOptions，两者都有效。您的第一个 index.html 是否可以通过/widget 访问，第二个可以通过/ 访问？此外，在第二个 index.html 中，您引用了整个文件内容，在第一个中只有 javascript 代码。我希望您的第一个不只包含该代码。 /widget 的这个页面包含的所有 JavaScript 代码吗？
我们可以将此讨论移至聊天吗？
我们必须继续在这里发表评论，直到出现将讨论转移到聊天以避免延长 cmets

【解决方案3】：

好吧，我刚刚遇到了同样的错误“错误代码：来自 IDP 的错误响应。”

如上面的 cmets 所述，有两种可能：

创建一个仅包含登录按钮的页面和另一个在单击按钮时前一个重定向到的页面
将"?mode=select"作为查询参数附加到url

在您的路线中重定向，例如在

app.get("/login", function(req, res) {
  res.redirect("/login?mode=select");        
}

来自浏览器的gitkit.js extracts itwindow.location.href。

【讨论】：