需要帮助验证令牌 - 我无法读取JSON响应数据

时间:2013-08-17 08:53:59

标签: angularjs google-oauth

根据documentation发送Google OAuth2令牌验证请求后,我在阅读JSON响应数据时遇到问题。

以下是Google OAuth2令牌验证请求:

$http.get('https://www.googleapis.com/oauth2/v1/tokeninfo', {params: {access_token: accessToken.token}})
                .success(function (data, status, headers, config) {
                    $log.info("sendValidationRequest() method: data: " + data);
                    deferred.resolve(data);
                    accessToken.state = getSession().state = $window.sessionStorage.state = "AccessTokenValidated";
                })
                .error(function (data, status, headers, config) {
                    //handle error
                });

因此,当我检查JSON响应数据对象时,我得到以下内容:

data.audience; // undefined
data.scope; // undefined
data.userid; // undefined
data.expires_in; //undefined

这是Chrome开发人员工具中的JSON响应数据: enter image description here

我希望JSON响应数据是documentation的JSON数组。 JSON响应数据似乎是编码的。我该如何解决这个问题?

以下是我的HTTP标头请求:

GET https://www.googleapis.com/oauth2/v1/tokeninfo?
access_token=ya29.AHES6ZQBj6feCrXuDoqwA3FpX1T1HO8fH1eWegJbiBTp7Cs HTTP/1.1
:host: www.googleapis.com
origin: http://localhost:8080
accept-encoding: gzip,deflate,sdch
accept-language: en-US,en;q=0.8
user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36
:path: /oauth2/v1/tokeninfo?  access_token=ya29.AHES6ZQBj6feCrXuDoqwA3FpX1T1HO8fH1eWegJbiBTp7Cs
accept: application/json, text/plain, */*
:version: HTTP/1.1
referer: http://localhost:8080/calendar-app/
:scheme: https
:method: GET

以下是我的HTTP响应标题:

HTTP/1.1 200 OK
status: 200 OK
version: HTTP/1.1
access-control-allow-origin: http://localhost:8080
access-control-expose-headers: Cache-Control,Content-Encoding,Content-Length,Content-Type,Date,Expires,Pragma,Server
cache-control: no-cache, no-store, max-age=0, must-revalidate
content-encoding: gzip
content-length: 182
content-type: application/json; charset=UTF-8
date: Sat, 17 Aug 2013 08:00:05 GMT
expires: Fri, 01 Jan 1990 00:00:00 GMT
pragma: no-cache
server: GSE
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-xss-protection: 1; mode=block

非常感谢任何解决我的问题的帮助。

谢谢。

经过一番研究,我发现这是一个特定于AngularJS $ http服务的问题;因为这不是JQuery的问题。以下是我的验证访问令牌代码在JQuery中的样子:

function validateToken() {
        $.ajax({
            url: 'https://www.googleapis.com/oauth2/v1/tokeninfo?access_token=' + accessToken,
            data: null,
            success: function(response){
                console.log('Our token is valid. and response.audience value is defined.');
            },
            error: function(error) {
                console.log('Our token is not valid....');
            },
            dataType: "jsonp"
        });
    }

JQuery Ajax请求标头是不同的请求标头与$ http服务请求标头不同(见上文):

GET https://www.googleapis.com/oauth2/v1/tokeninfo?access_token=ya29.AHES6ZTewZF3-aEJ3p8mdJahvTtZDNELYjpqLsGaB10Fnmk&callback=jQuery172036758901784196496_1376731301308&_=1376731301856 HTTP/1.1
:host: www.googleapis.com
accept-encoding: gzip,deflate,sdch
accept-language: en-US,en;q=0.8
user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/28.0.1500.95 Safari/537.36
:path: /oauth2/v1/tokeninfo?access_token=ya29.AHES6ZTewZF3-aEJ3p8mdJahvTtZDNELYjpqLsGaB10Fnmk&callback=jQuery172036758901784196496_1376731301308&_=1376731301856
accept: */*
:version: HTTP/1.1
referer: http://localhost:8080/calendar-app/google-oauth-test2.html
:scheme: https
:method: GET

当$ http服务发出请求时,Google Response响应标头会有所不同(参见上文):

HTTP/1.1 200 OK
status: 200 OK
version: HTTP/1.1
cache-control: no-cache, no-store, max-age=0, must-revalidate
content-encoding: gzip
content-length: 235
content-type: text/javascript; charset=UTF-8
date: Sat, 17 Aug 2013 09:21:40 GMT
expires: Fri, 01 Jan 1990 00:00:00 GMT
pragma: no-cache
server: GSE
x-content-type-options: nosniff
x-frame-options: SAMEORIGIN
x-xss-protection: 1; mode=block

所以现在的问题是,如何获得AngularJS $ http服务请求标头以匹配JQuery的AJAX请求标头的样子?或者是否有其他方法可以获得相同的结果;在成功访问令牌验证后从谷歌获取正确的JSON数组对象?

再次,非常感谢任何帮助!

我正在更新帖子,因为似乎有一些问题我是否在URL中有空格并且我没有显示原始JSON响应。我希望chrome Developer's Tools的这张图片清除了这一点。

enter image description here enter image description here

3 个答案:

答案 0 :(得分:1)

经过大量研究后,我能够通过使用$ http.jsonp()方法而不是$ http.get()方法来解决我的问题。我想我只是忽略了$ http.jsonp()方法,因为在制作远程脚本请求时我是新手,并且真的不知道JSONP是什么。

所以现在我的新代码看起来像这样:

$http.jsonp('https://www.googleapis.com/oauth2/v1/tokeninfo',
                {
                    params: {
                        access_token: accessToken.token,
                        callback: 'JSON_CALLBACK'
                    }
                })
                .success(function (data, status, headers, config) {
                    // Do something successful.
                })
                .error(function (data, status, headers, config) {
                    // TODO: Handle the error
                });

我要感谢所有花时间查看我的问题的人和那些回答我问题的人。我希望这能帮助像我一样对AngularJS,JSONP和Google OAuth2不熟悉的其他人。

谢谢!

答案 1 :(得分:0)

奇怪回应的主要原因是URL之间有空格?和access_token。

我无法帮助你,为什么没有一个完整的测试用例我可以运行来重现你的问题 - 它不会在本地测试中重现。

答案 2 :(得分:0)

使用角度1.2.x,这不会发生。显然,角度1.0.x是预先飞行$ http请求,谷歌的令牌信息服务拒绝。