如何解决“使用 Google 登录”按钮的 data-login_uri 属性如何使用?
我正在尝试实现“使用 Google 登录”按钮,如此处所述: https://developers.google.com/identity/gsi/web/guides/display-button
我对 data-login_uri
的期望感到困惑,如下图所示(取自上面链接的文档):
<div id="g_id_onload"
data-client_id="YOUR_GOOGLE_CLIENT_ID"
data-login_uri="https://your.domain/your_login_endpoint"
data-auto_prompt="false">
</div>
我已正确配置应用的客户端 ID,并且可以通过 Google 弹出窗口提供的大部分登录/身份验证流程。但是,一旦弹出窗口关闭,它就会尝试 POST 到我指定为 data-login_uri
的任何 URI。
这让我相信我们需要一个后端端点来做...某事...但我无法找到关于这个端点应该如何表现的任何文档,因此,我不确定要与我的后端开发人员沟通什么要求。
我错过了什么?
解决方法
此处data-login_uri 描述了 POST 内容,并在 Verify the Google ID token on your server side 中描述了您在后端执行的预期操作。
还强烈建议为每个请求生成一个 nonce 并在后端确认预期值,以避免重放攻击(与 CSP nonce 不同,以防止跨站点脚本)。
,TL;DR
您的服务器上需要一个后端进程(用 PHP、Python、Node 等编写),该进程可以将 token_id(从您引用的 div
接收)中继到 Google 进行验证。
为什么?
Google 的文档说:
警告:不要在后端服务器上接受普通用户 ID,例如您可以通过 GoogleUser.getId() 方法获取的用户 ID。修改后的客户端应用程序可以向您的服务器发送任意用户 ID 以模拟用户,因此您必须使用可验证的 ID 令牌来安全地获取服务器端登录用户的用户 ID。
详情
data-auto_prompt
参数的值应指向 API 的端点或后端的可执行 CGI 进程。
假设您的域名是“example.com”。需要有一个端点,或者该端点处的可执行 cgi 脚本能够捕获 POST 请求,并使用 application/x-www-form-urlencoded
编码。它可能是这样的:https://www.example.com/login。
在这个端点,脚本/路由应该能够提取'tokenid'
Google 的文档在两个地方描述了后端必须做的事情:
在您的服务器端验证 Google ID 令牌:
这是一个使用 Flask 框架的“登录”路由的 Python 代码片段: (建议使用虚拟环境,并且需要安装两个 google api 的 pip。)
在命令行:pip install --upgrade google-api-python-client google-auth-httplib2 google-auth-oauthlib
# Required imports from google API
from google.oauth2 import id_token
from google.auth.transport import requests
@bp.route('/login',methods=['POST'])
def login():
# Supplied by g_id_onload
tokenid = request.form['credential']
# Hardcoded client ID. Substitute yours.
clientid = XXXXX
# Display the encrypted credential
current_app.logger.debug(f"Token = {tokenid}")
try:
idinfo = id_token.verify_oauth2_token(tokenid,requests.Request(),clientid)
# Display the verified user information
current_app.logger.debug(f"idinfo = {idinfo}")
# jsonify returns a response object
user_data = jsonify({
'username': idinfo['email'],'name': idinfo['name'],'id': idinfo['sub']
})
return user_data
except:
return Response(status=404)
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。