$http get call with AngularJS my API is not working

Question

I am creating a Web Application. I have created an API and when I try to make an http get call from angular, it fails. I know that my api works because I have already tested it on the browser and Postman (On Chrome). In addition, I know that my code is good because I tested it by changing the url to githubs's api (https://api.github.com/users), and the response was successful. Can anyone can help me figure out why the calls to my API don't work if both return the same (a collection of JSon objects)?

$http({
        method: 'GET',
        url:'http://localhost:63473/api/posts' // my api
        //url: 'https://api.github.com/users' // github api
    })
        .then(function (response) {

            // successful call
            angular.copy(response.data, viewModel.posts);
            alert("Good");

        }, function (error) {

            // call to api failed
            viewModel.errorMessage = "Failed to load posts: " + error;

        });

This is the response of my call from Postman

[
{
   "id": "6db78556-c4dc-4c7c-a969-db0d202f32fc",
   "text": "This is the second Post.",
   "postedOn": "2016-04-30T21:26:56.7886027-04:00"
},
{
   "id": "5c9d9e0b-0b23-4895-93ba-b86a36e03f84",
   "text": "Hello everyone, this is my first Post",
   "postedOn": "2016-04-30T21:26:56.7846017-04:00"
}
]

Answer 1

Are you running the API and the $http JS on the same URL? If they are not (even if the port is different), then you need to enable CORS on your API to allow cross domain requests.