在Cordova/Phonegap中使用Google API javascript

Using the Google API javascript in Cordova / Phonegap

本文关键字：Google API javascript Cordova Phonegap      更新时间：2023-09-26

我正在使用Cordova开发一个应用程序，并希望将文件保存在Googe Drive中。

我成功地登录了谷歌，使用cordova-plugin-googleplus（https://github.com/EddyVerbruggen/cordova-plugin-googleplus）。但是，我无法将插件返回给我accessToken或idToken，因此我可以与Google javascript API一起使用。

window.plugins.googleplus.login(
    {
        'scopes': 'https://www.googleapis.com/auth/drive.file profile',
        'offline': true, 
        'webApiKey': ‘CODE’ 
    },
    function (obj) {
        $scope.$apply(function() {
            $scope.srcImage = obj.imageUrl;
            $scope.NomeGoogle = obj.displayName;
        });
    },
    function (msg) {
        alert('Erro');
        alert('error: ' + msg);
    }
);

我尝试使用以下代码，但返回以下错误：

"uncatch gapi.auth2.ExternallyVisibleError： Invalid cookiePolicy"

gapi.load('auth2', function() {
    gapi.auth2.init({
        client_id: 'REVERSED_CLIENTID',
    }).then(function(){
        auth2 = gapi.auth2.getAuthInstance();
        console.log(auth2.isSignedIn.get()); //now this always returns correctly        
    });
});

我设法找出了问题所在，为什么没有从插件获取服务器AuthCode。有必要在 Google 开发者控制台上创建 2 个凭据。第一个必须是Android，这将用于插件，第二个应该是Web应用程序，这是实现serverAuthCode所必需的。

代码如下所示

window.plugins.googleplus.login(
    {
        'scopes': 'https://www.googleapis.com/auth/drive.file profile',
        'offline': true, 
        'webApiKey': ‘REVERSED_CODE of Web App Credential’ 
    },
    function (obj) {
        $scope.$apply(function() {
            $scope.srcImage = obj.imageUrl;
            $scope.NomeGoogle = obj.displayName;
        });

            var data = $.param({
                client_id: 'REVERSED_CODE of Web App Credential',
                client_secret: 'SECRET_CODE of Web App Credential',
                grant_type: 'authorization_code',
                code: obj.serverAuthCode
            });
            var config = {
                headers : {
                    'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
                }
            }
            $http.post("https://www.googleapis.com/oauth2/v3/token", data, config).success(function(data, status) {
                //data.access_token;
/** from now you can do use of google API **/
            })
            .error(function(data, status) {
                console.log(data);
                console.log(status);
            });
    },
    function (msg) {
        alert('Erro');
        alert('error: ' + msg);
    }
);

感谢您的回复罗乔波

起初，我希望跳过对cordova-plugin-googleplus的需求，而只是使用Cordova/PhoneGap中的gapi来处理Google的身份验证，但似乎gapi客户端身份验证可能无法在Cordova的file://协议中工作。

@Joao的答案让我朝着正确的方向前进，但是在检索access_token后尝试使用该gapi时，我不断收到Invalid cookiePolicy错误（这是因为我忽略了下面列出的步骤#2，并且在使用plugini进行身份验证后，我错误地尝试使用gapi再次进行身份验证）。

有一个步骤（下面提到的#3）我不清楚。要向Google进行身份验证，然后在Cordova/PhoneGap中使用gapi，这反而起作用了......

    使用
  1. Cordova-plugin-googleplus来处理身份验证和访问令牌检索，这里根本不使用GAPI
  2. 加载 GAPI 客户端库（跳过gapi.client.init()调用和所有正常的 GAPI 身份验证过程）
  3. 将我们从插件获得的访问令牌附加到 gapi 客户端，然后根据需要进行 gapi 调用

步骤#3花了我一些挖掘才能找到，这意味着我需要添加access_token 

gapi.client.setToken({access_token:'abc123456xyz'});

一旦访问令牌附加到 gapi 客户端，我就可以在 Cordova/Phonegap 中使用 gapi：

// Load the YouTube API.
gapi.client.load('youtube', 'v3', function() {
  // Do stuff...
};

尝试 

    window.plugins.googleplus.login(
        {
            'scopes': 'https://www.googleapis.com/auth/drive.file profile',
            'offline': true, 
            'cookiepolicy': 'none',
            'webApiKey': ‘CODE’ 
        }
相关文章：