“使用 Google 登录”按钮的 data-login_uri 属性应使用什么？

Question

我正在尝试实现“使用 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.

这让我相信我们需要一个后端端点来做......某事......但我无法找到有关此端点应该如何表现的任何文档，因此我不确定有什么要求与我的后端开发人员沟通。

我错过了什么？

Answer 1

TL;DR You need a backend process (scripted in PHP, Python, Node, etc.) on your server which can relay a token_id (received from the div you quoted) to Google for validation.

Why?

Google's documentation says:

Warning: Do not accept plain user IDs, such as those you can get with the GoogleUser.getId() method, on your backend server. A modified client application can send arbitrary user IDs to your server to impersonate users, so you must instead use verifiable ID tokens to securely get the user IDs of signed-in users on the server side.

Details

The value of the data-auto_prompt parameter should point to an endpoint of an API or an executable CGI process in the back end.

Let's say your domain name is 'example.com'. There needs to be an endpoint, or executable cgi script at that endpoint that is capable of capturing a POST request, with application/x-www-form-urlencoded encoding. It might be something like this: https://www.example.com/login.

At this endpoint, a script / route should be capable of extracting the 'tokenid'

Google's documentation describes what the back end must do in two places:

Verify the Google ID token on your server side:

1. Verify the Cross-Site Request Forgery (CSRF) token and
2. Verify the integrity of the ID token

Here's a python code fragment for a 'login' route, using the Flask framework: (A virtual environment is recommended and a pip install of two google api's are required.)

At the command line: 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)