我正在尝试显示来自imdb api的图像,该图像将显示在todo.poster中,当我尝试在本地访问它时,它的工作原理非常好。但是,当我在服务器上部署项目时,图像不会第一次加载,但是如果我在新选项卡中一次打​​开同一图像,然后刷新我的项目url,图像就会显示出来。我很沮丧地试图解决这个问题

 <div ng-repeat="todo in todos">
            <a href="#show/{{todo.title}}" >
                <h2>{{todo.title}}</h2>
                </a>
                <br>
                <a href="#show/{{todo.title}}" >
                <img ng-src= {{todo.poster}} alt="Image Not Found">
                </a>
      </div>

 http://ia.media-imdb.com/images/M/MV5BMTk4ODk5MTMyNV5BMl5BanBnXkFtZTcwMDMyNTg0Ng@@._V1_SX300.jpg

如果使用浏览器的inspect元素,我会看到此错误
  Failed to load resource: the server responded with a status of 403 (Forbidden)

最佳答案

最终结果是imdb实际上阻止了显示他们的海报的请求,他们不允许热链接,这就是他们阻止它的原因。他们正在检查引用以阻止请求。

如果其他人遇到相同的问题,可以有多种解决方案,一种方法是先在服务器上下载图像,然后从那里显示图像,
另一个可能是使用其他一些API,例如moviedb。请注意,烂番茄的api返回的图像仅为缩略图大小,因此不会有帮助。

或者,如果有人想使用仅从imdb获取数据的api,则可以将其与moviedb结合使用,例如从imdb获取所有信息,然后使用imdb返回的电影ID,您可以从moviedb获取海报图像或其他图像。

关于javascript - 图片未加载javascript,html,angular,imdb api,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/29334108/

10-12 23:30