如何使新的“使用 Google 登录”按钮在页面重新加载时保留用户登录状态?

2024-04-07

谷歌正在弃用旧的登录按钮 https://developers.google.com/identity/sign-in/web/sign-in有利于新的那一个 https://developers.google.com/identity/gsi/web。我有一个单页迷你应用程序,其中服务器仅返回静态页面内容。该页面要求用户登录并在客户端处理返回的令牌。 旧按钮很好地处理了页面重新加载的情况,立即使用新令牌调用回调。但是,新按钮似乎无法处理页面重新加载。 当使用带有 HTML 的 JavaScript API 时,例如:

<div id="parent" />
<script>
function initGoogleSignIn() {
    google.accounts.id.initialize({
                                   client_id: 'YOUR_GOOGLE_CLIENT_ID',
                                   auto_select: true,
                                   callback: onSignIn,
                                  });
    google.accounts.id.renderButton(document.getElementById('parent'),{});
}
function onSignIn(payload) {
    let unverifiedResponsePayload = JSON.parse(atob(payload.credential.split('.')[1])); //this is just an example - instead you should _verify_ the token before any actual use
    console.log(unverifiedResponsePayload.email);
}
</script>
<script src="https://accounts.google.com/gsi/client" onload="initGoogleSignIn()"></script>

根据文档 https://developers.google.com/identity/gsi/web/reference/js-reference#auto_select将 auto_select 设置为 true 应该会导致“当之前只有一个 Google 会话批准了您的应用程序时,无需任何用户交互即可自动返回 ID 令牌。”但是,登录然后重新加载页面不会调用回调。旧按钮确实会以类似的设置调用回调。

问题是如何实现获取令牌的旧行为,而无需使用新按钮重新加载页面上的用户交互?


我发现,可以配置“一键”,这将导致在页面重新加载时调用回调,但只有在显示一键块和几秒钟的延迟后才调用。 我仍然想知道这是否是一个预期的行为,只是没有正确记录,或者文档是正确的,并且该行为将由 Google 在库中修复。

这是如何初始化Google登录可以更改功能以使用“一键”:

function initGoogleSignIn() {
    google.accounts.id.initialize({
                                   client_id: 'YOUR_GOOGLE_CLIENT_ID',
                                   auto_select: true,
                                   callback: onSignIn,
                                   prompt_parent_id: 'parent', //DOM ID of the container element for One Tap block
                                  });
    google.accounts.id.prompt((notification) => {
        if (notification.isNotDisplayed() || notification.isSkippedMoment() || (notification.isDismissedMoment() && notification.getDismissedReason() != 'credential_returned')) {
            // no sign-in happened, display the button
            google.accounts.id.renderButton(document.getElementById('parent'),{});
        }
    });
}

这种方法仍然会为调用回调增加明显的延迟(在我的例子中>4秒)。旧按钮的速度要快得多,而且没有任何视觉表示。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使新的“使用 Google 登录”按钮在页面重新加载时保留用户登录状态? 的相关文章

随机推荐

  • -1 是一个神奇的数字吗?反模式?代码味道?当局的引述和指南[重复]

    这个问题在这里已经有答案了 可能的重复 不断的虐待 https stackoverflow com questions 1862593 constant abuse 我见过 1用于各种 API 最常用于搜索具有从零开始的索引的 集合 时 通
  • 从 Rails 3 升级后不允许使用 Rails 4 方法

    我有一个现有的代码库 我正在尝试将其从 Rails 3 2 升级到 Rails 4 0 我有一个名为 asset controller 的控制器 带有 create 方法 并且我的路由文件中有一个条目 resources assets 在前
  • 如何创建一个接受任何类型变量的 Java 函数?

    我想创建一个可以接受任何传入变量的函数 无论类型如何 int double String或其他对象 然后可能确定变量的类型并对该类型进行有条件的操作 我怎样才能做到这一点 重载是最推荐的选项 大多数时候您不需要接受任何类型变量的函数 但是如
  • 为什么ssd和yolo没有roi池化层?

    我们知道目标检测框架像faster rcnn and mask rcnn has an roi pooling layer or roi align layer 但是为什么ssd和yolo框架没有这样的层呢 首先我们要明白这样做的目的是什么
  • @font-face 和 .ttf 文件出现问题

    我正在尝试使用 font face 来实现我在线下载的字体 http www losttype com font name blanch http www losttype com font name blanch 并且我在让它在任何浏览器
  • 保存 ember 数据模型后的转换

    我想在创建帖子后进行转换 post new gt 单击提交 gt Rails 后端成功创建帖子并响应 json gt 重定向到新创建帖子的路径 在 ember data example github 源代码中 他们使用这种方法 transi
  • Grails JSONBuilder

    如果我有一个简单的对象 例如 class Person String name Integer age 我可以使用 JSONBuilder 轻松地将其用户定义的属性呈现为 JSON def person new Person name bo
  • Rails 在模型中验证值在数组内

    我有一个表格 我可以在其中传递一个字段命名 type我想要检查它的值是否在允许类型的数组内以便任何人不得发布不允许的类型 数组看起来像 allowed types type1 type2 type3 type4 type5 type6 ty
  • 异步顺序调用方法

    我有一个在方法中调用的方法列表 如下所示 this doOneThing someOtherObject doASecondThing this doSomethingElse 当这是同步时 它们会一个接一个地执行 这是必需的 但现在我有
  • WPF 数据绑定:根据 var 的内容启用/禁用控件?

    我的表单上有一个按钮 仅当在树视图 或选项卡项中的列表视图 中选择一个项目时才应启用该按钮 当选择一个项目时 它的值将存储在字符串成员变量中 我可以绑定吗IsEnabled按钮的属性到成员变量的内容 也就是说 如果成员变量不为空 则启用该按
  • 杀死一个线程

    我正在处理的项目中有以下代码片段 public void Start Thread t new Thread NotifyIfNecessary Threads Add t t Start t Abort 我想要的是线程 t 应该执行方法
  • 带参数名称和冒号的 C# 方法调用

    我有时开始注意到 当我在 C 中进行方法调用时 我调用的方法的参数名称将显示在附加冒号的智能感知列表中 然后我可以格式化该方法如此称呼 MethodCall parameter1 value1 parameter2 value2 这是新的语
  • 样板代码替换 - 这段代码有什么不好的地方吗?

    我最近创建了这两个 不相关的 方法来替换我的 winforms 应用程序中的大量样板代码 据我所知 它们工作正常 但我需要一些保证 建议来确定是否存在我可能遗漏的一些问题 从记忆里 static class SafeInvoker Util
  • 根据 GPS 坐标计算平均速度的最佳实践

    我这里有一个可以给我 GPS 坐标的设备 我可以定义的时间间隔 我想用它来计算驾驶或驾车旅行时的平均速度 实际上 我使用了正交公式来计算两点之间的距离 然后将其除以给定的时间间隔 通过我遵循的实施这个词 http de wikipedia
  • 在Webpack中通过代码将nonce设置为样式标签

    因为我想启用内容安全策略 CSP noncestyle 属性 所以我需要设置nonce通过代码动态调整样式 网页包设置 devServer contentBase dist watchContentBase true headers Con
  • 为什么我的 mongodb 集合会自动删除?

    我在三个 EC2 实例中有一个 MongoDB 客户端 并且创建了一个副本集 上次我遇到了空间问题约束 https askubuntu com questions 864631 amazon ec2 instance ubuntu 16 0
  • 核心数据实体中布尔属性的类型是什么?

    我以编程方式使用核心数据 即不使用 xcdatamodel数据模型文件 其方式与 Apple 中描述的方式大致相同核心数据实用程序教程 http developer apple com documentation Cocoa Concept
  • 静态数据成员模板专业化的实例化点在哪里

    考虑下面的代码 include
  • Java-如何通过单击按钮添加更多文本字段?

    我创建了一个frame在Java中有一些textfields and buttons在里面 假设用户想要更多文本字段 例如添加更多数据 我想放一个button当用户点击时the button 然后一个新的textfield应该出现 然后用户
  • 如何使新的“使用 Google 登录”按钮在页面重新加载时保留用户登录状态?

    谷歌正在弃用旧的登录按钮 https developers google com identity sign in web sign in有利于新的那一个 https developers google com identity gsi w