Why this Angular script is unable to retrieve JSON generated by Laravel 4?

Question

AngularJS

$http({
        method: 'GET',
        url: '//www.ign-design.net/users'
    }).success(function (data, status, headers, config) {
        $scope.user.username = data.name;
    }).error(function (data, status, headers, config) {
        console.log(data);
    }
);

Laravel

Route::get('users', function() 
{
    return Response::json(array('name' => 'Anil', 'yas' => 25));
});

The problem is, the script works fine when I add //echo.jsontest.com/name/Anil/yas/25 as the $http URL . However, then I add //www.ign-design.net/users (which is being generated by Laravel using the code above), it doesn't work. It goes to .error and console.log outputs: ""

I don't know what's wrong. Why my Laravel's Response::json() doesn't satisfy AngularJS like jsontest.com website? Spent like 2 hours trying to figure it out - no luck.

Ps. Probably a header issue - but I've also tried to output JSON data using plain PHP and setting headers myself. Didn't work either.

Answer 1

It appears that you're running into a cross-domain problem. Either move your angular code to the same domain, or make your Laravel code understand how to respond to cross-domain calls.

See: https://developer.mozilla.org/en-US/docs/HTTP/Access_control_CORS for more details.