0

I am using AngularJS for my client side application. I have my apis ready to be consumed by the front side application but I think I don't know how to properly call them. I have a login api which is called by fbLogin from the front end. The front side implementation of my controller and service is like this.

controller.js

 FB.login(function(response) {
    if (response.authResponse) {
     console.log('Welcome!  Fetching your information.... ');
     FB.api('/me', 'GET',{fields:'email,first_name,name,id,picture'}, function(response) {

       console.log('Good to see you, ' + response.name + '.');
       console.log(response);


        $scope.$apply(function(){
       $scope.facebook.username=response.name;
       $scope.facebook.email=response.email;
       $scope.fb_image=response.picture.data.url;
        });
     var accessToken=FB.getAuthResponse();
     var facebookAuthenticationObject={
                        'access_token':accessToken.accesToken,
                        'id':accessToken.userID,
                        'app_platform':'web',
                        'provider':'facebook'

       }
     authenticationService.login(facebookAuthenticationObject)
            .then(function(response){
                $scope.jwt_token=response
            }) 
     console.log(accessToken);
     });
    } else {
     console.log('User cancelled login or did not fully authorize.');
    }
},{
    scope:'email,user_likes',
    return_scopes:true
});

    }

services.js

angular.module('workit.services',[])
     .factory('authenticationService', ['$http', function($http) {

     var url = 'localhost:5000/api/auths/login';
     var authenticationService = {}; 

     authenticationService.login=function(authObject){
         return $http.post(url,authObject);
     }

     return authenticationService;

 }])
 ;

Can anyone tell what might be the problem? My api is 100% correct because I used postman to make a call and it gives a successful response but I am not able to achieve it through my client side implementation. Any help would be much appreciated. Thanks a bunch!!

Full error:

"XMLHttpRequest cannot load http://localhost/api/auths/login. Invalid response. Origin 'http://192.168.150.130:8081' is therefore not allowed access."

Possibly unhandled rejection: {"data":null,"status":-1,"config":{"method":"POST","transformRequest":[null],"transformResponse":[null],"jsonpCallbackParam":"callback","url":"http://192.175.117.177:5000/api/auths/login","data": {"id":"10210782205725002","app_platform":"web","provider":"facebook"},"headers":{"Accept":"application/json, text/plain, /","Content-Type":"application/json;charset=utf-8"}},"statusText":""}

BleachedAxe
  • 393
  • 2
  • 5
  • 20
  • Possible duplicate of [XMLHttpRequest cannot load https://www.\[website\].com/](https://stackoverflow.com/questions/35553500/xmlhttprequest-cannot-load-https-www-website-com) – Quentin Jun 21 '17 at 20:11
  • Its not. My error is exactly as i stated above. The link that you posted has "No 'Access-Control-Allow-Origin' header is present on the requested resource." in addition to my error. – BleachedAxe Jun 21 '17 at 20:15
  • Fundamentally, the problem is that you are failing to appropriately respond to a cross origin request. The duplicate covers the topic in a lot of depth (including a specific mention of why you don't experience the same problem with postman). There isn't much more that could be said unless you provided more information (such as the server side code responding to your request, and the HTTP request and response that your browser actually makes and receives) … but the duplicate should still give you enough information to solve it yourself. – Quentin Jun 21 '17 at 20:18
  • Can your computer login using your facebook account to any website? – jdweng Jun 21 '17 at 20:47
  • Yes it does, I even get the access token when i console log the response out. Its just not going into the server side. My facebook login works perfectly elsewhere.. – BleachedAxe Jun 21 '17 at 21:01

0 Answers0