如何将 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 如何直接加载小部件。
我需要将 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 如何直接加载小部件。