javascript - 在AngularJS中动态加载图像时禁止出现403

Question

我正在从我的 api 加载 json 数据，其中包含指向域外图像的 url。我过去做过这个，而不是Angular，我从来没有见过这个问题......

在我的小提琴中，当我单击“搜索”时，会出现两个图像，但它们都抛出 403 禁止并且不加载。

我无法弄清楚为什么会这样。有任何想法吗？

var app = angular.module('app', []);

function HomeController($scope) {
    $scope.search = function() {
        $scope.movies = [ 
            { Title: 'The Matrix', Poster: 'http://ia.media-imdb.com/images/M/MV5BMTU4NTczODkwM15BMl5BanBnXkFtZTcwMzEyMTIyMw@@._V1._SY317_.jpg' },
            { Title: 'The Matrix Reloaded', Poster: 'http://ia.media-imdb.com/images/M/MV5BMTg1NTkxOTk0MV5BMl5BanBnXkFtZTYwODc4MTc4._V1._SY317_.jpg' }
        ];
    };
}

Answer 1

似乎 imdb 正在检查引用者，因此不允许其他方直接在他们的网站上嵌入他们的图像。如果您尝试使用来自其他域的图像，它可以工作：http: //jsfiddle.net/PZJKZ/2/

var app = angular.module('app', []);

function HomeController($scope) {
    $scope.search = function() {
        $scope.movies = [ 
            { Title: 'The Matrix', Poster: 'http://dartr.com/wp-content/uploads/2011/10/javascript-logo.png' },
            { Title: 'The Matrix Reloaded', Poster: 'http://wpmu.org/wp-content/uploads/2010/04/jquery-logo1.png' }
        ];
    };
}