外部资源不被AngularJs加载 [英] External resource not being loaded by AngularJs

问题描述

采用了棱角分明和PhoneGap的，我试图加载视频这是一个远程服务器上，但整个问题就来了。在我的JSON，网址放在只是一个普通的HTTP URL

Using Angular and Phonegap, I'm trying to load a video that is on a remote server but came across an issue. In my json, the url is put in as just a plain http url

"src" : "http://www.somesite.com/myvideo.mp4"

我的视频模板

 <video controls poster="img/poster.png">
       <source ng-src="{{object.src}}" type="video/mp4"/>
 </video>

我的所有其他数据被加载，但是当我看到我的控制台，我得到这个错误：

All my other data gets loaded but when I look my console, I get this error:

Error: [$interpolate:interr] Can't interpolate: {{object.src}}
Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.  URL

我试图加入 $ compileProvider 在我的配置设置，但它并没有解决我的问题。

I tried in adding $compileProvider in my config set up but it did not resolve my issue.

$compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel):/);

我看到 这篇文章关于跨域问题 小号，但我不知道如何解决这个还是我应该去哪个方向。任何想法？任何帮助AP preciated

I saw this post about cross domain issues but I'm not sure how to resolve this or what direction I should go in. Any ideas? Any help is appreciated

推荐答案

这仅仅是为我工作的解决方案：

This is the only solution that worked for me:

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

app.controller('MainCtrl', function($scope, $sce) {
  $scope.trustSrc = function(src) {
    return $sce.trustAsResourceUrl(src);
  }

  $scope.movie = {src:"http://www.youtube.com/embed/Lx7ycjC8qjE", title:"Egghead.io AngularJS Binding"};
});

然后在iframe：

Then in an iframe:

<iframe class="youtube-player" type="text/html" width="640" height="385" ng-src="{{trustSrc(movie.src)}}" allowfullscreen frameborder="0">

<一个href=\"http://plnkr.co/edit/tYq22VjwB10WmytQO9Pb?p=$p$pview\">http://plnkr.co/edit/tYq22VjwB10WmytQO9Pb?p=$p$pview

这篇关于外部资源不被AngularJs加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！