Google OAuth 2 访问令牌使用纯 Javascript 或 JQuery

Question

我正在测试 Google OAuth 2.0。我有我的客户端 ID、客户端密码和授权码。现在我想获得访问和刷新令牌。

但是，我可以从 PHP 开始。但是在使用 Javascript.

时出现 Invalid Grant 错误

    <!DOCTYPE html>
    <html>
    <head>
        <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
    </head>

    <body>
        <a href='#' onClick='getAccessToken();'> Get your Access Token </a>
        <pre id="response"> </pre>

        <script>
            function getAccessToken() {

                $.ajax({
                    type: 'POST',
                    url: "https://accounts.google.com/o/oauth2/token",
                    contentType: 'application/x-www-form-urlencoded',
                    dataType: 'json',
                    data: {
                        client_id: 'MY CLIENT ID',
                        client_secret: 'MY SECRET',
                        code: 'MY AUTH CODE',
                        redirect_uri: 'http://localhost:8888/google-api.html',
                        grant_type: 'authorization_code'
                    },

                    success: function (data) {
                        $('#response').html(data);
                    },
                    error: function (e) {
                        $('#response').html(e.responseText);
                    }
                });

            }
        </script>

    </body>
    </html>

基本上我正在尝试将下面的 PHP Curl POST 请求转换为 Ajax

    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL,"https://accounts.google.com/o/oauth2/token");
    curl_setopt($ch, CURLOPT_POST, TRUE);
    curl_setopt($ch, CURLOPT_HTTPHEADER, [ 'Content-Type: application/x-www-form-urlencoded']);
    curl_setopt($ch, CURLOPT_POSTFIELDS, http_build_query([
        'code'          => $code,
        'client_id'     => $client_id,
        'client_secret' => $client_secret,
        'redirect_uri'  => $redirect_uri,
        'grant_type'    => 'authorization_code',
    ]));
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    $response = curl_exec($ch);
    curl_close ($ch);

注意：stack overflow 中的同类问题有很多观点，但仍然没有答案。天才开发人员请提供您的意见。我也卡了3天了

Answer 1

感谢@Tankaike。这个问题在 Whosebug 被问了 3-4 次，没有人认真回答。

初学者！！！需要注意的一点：Auth Code works only once :) 要获取新的访问令牌，请使用您从第一个响应中获得的刷新令牌

        $.ajax({
            type: 'POST',
            url: "https://accounts.google.com/o/oauth2/token",
            contentType: 'application/x-www-form-urlencoded; charset=utf-8',
            crossDomain:true,
            cache : true, 
            dataType: 'json',
            data: {
                client_id: client_id,
                client_secret: client_secret,
                code: code,
                redirect_uri: redirect_uri,
                grant_type: grant_type,
            },

            success: function (data) {
                $('#response').html(JSON.stringify(data, null, " "));;
            },
            error: function (e) {
                $('#response').html(e.responseText);
            }
        });

Google OAuth 2 访问令牌使用纯 Javascript 或 JQuery

Google OAuth 2 Access Token using pure Javascript or JQuery

javascript

ajax

google-api

google-api-client

google-oauth