如何将 Google Identity Toolkit 与单个网页应用程序(例如 GWT)集成

How to integrate Google Identity Toolkit with a single webpage app (e.g. GWT)

我需要将 Google 的 identitytoolkit (Google's identitytoolkit) 与我的 Google webtoolkit (GWT) 应用程序集成。

然而,呈现 gitkit signInButton 或小部件已经不是直截了当的,因为这样做的方法链接到 "window.onload"。我需要稍后渲染小部件。

我设法做到了(见下文),但我对此并不满意,我想知道是否有人找到了更好的集成方式。

 private native void showGitKitWidget() /*-{
        $wnd.google.identitytoolkit.signInButton(
            '#gitkitDivId', // accepts any CSS selector
            {
             widgetUrl: "//127.0.0.1:8888/gitkit/signin.html",
             signOutUrl: "/gitkit/signout",
             popupMode: true                    
            }
        );

        var evt = $doc.createEvent('Event');
        evt.initEvent('load', false, false);
        $wnd.dispatchEvent(evt);
    }-*/;

更新 实际上,为 signInButton 使用 popupMode 参数可以使无缝集成更加紧密。这让小部件在浏览器中弹出 window 并保持 GWT window 不变。然后在小部件中而不是重定向到 successUrl 我使用 JS 回调来触发 AJAX 调用。

var config = {
            idps: ["googleplus"],
            signInSuccessUrl: '//127.0.0.1:8888/gwt/servlet/gitkit/signedin',          
            callbacks: {
            signInSuccess: function(tokenString, accountInfo,
              opt_signInSuccessUrl) {
                /* !!! Tell GWT parent window that we are ready...
                 I believe using a cookie for which the parent is
                 regularly looking is the way to go, because it
                 will work in mobile browsers too.
                */ 

                return false; // prevents redirect to signInSuccessUrl
              }
           }

更新 最后,GWT 父级 window 将等待结果 cookie,如果找到,则对 signInSuccessUrl 进行 AJAX 调用。它还必须再次呈现 signInButton,然后显示已登录的用户。

所以唯一丑陋的解决方法是如何使用 onload 方法调用呈现 signInButton。

如果有一种方法可以在需要时动态呈现 signInButton,那将非常有帮助,例如,如果有一个“$wnd.google.identitytoolkit.update()”方法。这可能是第一次在任何时候调用,并且应该能够处理登录状态更改!

总之,我已经回答了我自己的问题,这可能对其他人有帮助,但我仍然想问一下是否有更好的方法,我错过了。

正如您所注意到的,Identity Toolkit 小部件当前需要通过页面加载来触发。单页应用程序(如使用 GWT 构建的应用程序)应将小部件放置在单独的页面上。然后你可以在那里重定向用户 - 或者通过弹出窗口呈现,正如你所注意到的 - 以登录用户。

如果呈现登录按钮有问题,documentation 如何直接加载小部件。