Angular + Firebase - Access-Control-Allow-Origin错误,简单的$ http请求

时间:2015-12-19 11:08:30

标签: angularjs google-api firebase angularfire

我正在尝试使用Firebase和Angular来获取用户的访问令牌,以便稍后使用$ http.get请求检索他的联系人列表以获取谷歌的API。

第一部分表现不错,弹出窗口显示,以及auth copmletes,所以我得到了具有正确访问令牌的auth对象。

当用户点击“使用Google登录”按钮时,此功能会触发:

angular.module('myApp.gtest', ['ngRoute', 'firebase'])

.factory("Auth", ["$firebaseAuth", function($firebaseAuth) {
    var ref = new Firebase("https://*myfirebaseappurl*.firebaseio.com/");
    return $firebaseAuth(ref);
}])

.controller('gtestCtrl', ['$scope', '$http', '$firebaseAuth', 'Auth', function($scope, $http, $firebaseAuth, Auth) {
    ...
    var onAuthCallback = function(authData) {
        if (authData === null) {
            console.log("onAuth fired with null data.");
            return;
        } else {
            console.log("onAuth fired, with authData = ", authData);
            refreshContacts(authData);
        }
    }

    $scope.auth = Auth;
    $scope.deauth = $scope.auth.$onAuth(onAuthCallback);


    var refreshContacts = function(authData) {
    console.log("Refreshin contacts, with authData:", authData);
    $scope.curUserName = authData.google.displayName;
    $http.get("https://www.google.com/m8/feeds/contacts/default/thin?alt=json&access_token=" + authData.google.accessToken + "&max-results=800&v=3.0", {})
        .then(
            function successCallback(res) {
                console.log("on auth: ", res);
                var arr = res['data']['feed']['entry'];
                $scope.availableContacts = arr.length;
                var contacts = [];
                for (i = 0; i <= arr.length; i++) {
                    if (!arr[i] || !arr[i]['gd$email'] || !arr[i]['gd$email'][0]['address'])
                        continue;
                    contact = {
                        name: arr[i]['title']['$t'],
                        email: arr[i]['gd$email'][0]['address']
                    };
                    contacts.push(contact);
                }
                $scope.contacts = contacts;
                $scope.statusMsg = contacts.length + " / " + arr.length + " Contacts loaded!";
            },
            function errorCallback(res) {
                $scope.statusMsg = "Error loading contacts.";
                console.log("google auth error: ", JSON.stringify(res));
            });
    };
    ...
});

刷新联系人只是使用用户的联系人更新$ scope.contacts。页面本身的刷新是通过角度双向绑定完成的。

当我使用http-server在http://127.0.0.1:8080上测试时,或者在部署到firebase的托管时,我遇到了同样的错误:

  

XMLHttpRequest无法加载https://www.google.com/m8/feeds/contacts/default/thin.json?alt=json&access_token= ***** MY ACCESS TOKEN HERE ******&amp; max-results = 800&amp; v = 3.0。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,不允许原点“http://127.0.0.1:8080”访问。响应的HTTP状态代码为401。

我已按照Firebase上的教程进行了操作,并在需要的时候将http://127.0.0.1:8080添加到Google开发者控制台...

有什么建议吗?

0 个答案:

没有答案