Html 在本地主机测试服务器上加载映像时出错

我有一个奇怪的问题，就是找不到解释

我正在为我们的家庭开发一个AngularJS网站，并整合来自各种web服务的数据。目前我正在处理照片部分，该部分将整合我们Flickr帐户中的照片

我有一个主页，其中列出了各种照片集，并显示了该集的主要照片以及标题。（注意：我使用Flickr'extras'参数在API调用中返回主照片的URL。）

{{p.title.{u content}}

单击照片时，路由将显示一个页面，其中包含该组照片中的所有照片列表，显示图像和标题

<div data-ng-repeat="p in vm.photoSetData.photo">
    <a ng-href="#/photos/{{vm.photoSetId}}/{{p.id}}"
        <img ng-src="{{p.url_s}}"></img>
    </a>
    <h4>{{p.title}}</h4>
</div>

{{p.title}}

现在，问题出在这里。当我把代码上传到我的托管提供商的公共网站上时，一切正常。两个页面都显示各自的照片。但是，当我尝试在本地系统上运行站点时，无论是在MAMP还是NodeJS（使用http服务器），第二页都会为每个映像显示一个错误：

Error: [$interpolate:interr] Can't interpolate: {{p.url_s}}
Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.  URL: https://farm1.staticflickr.com/37/82749767_e82ff60ce3_m.jpg
http://errors.angularjs.org/1.2.9/$sce/insecurl?p0=https%3A%2F%2Ffarm1.staticflickr.com%2F37%2F82749767_e82ff60ce3_m.jpg
http://errors.angularjs.org/1.2.9/$interpolate/interr?p0=%7B%7Bp.url_s%7D%7D&p1=Error%3A%20%5B%24sce%3Ainsecurl%5D%20Blocked%20loading%20resource%20from%20url%20not%20allowed%20by%20%24sceDelegate%20policy.%20%20URL%3A%20https%3A%2F%2Ffarm1.staticflickr.com%2F37%2F82749767_e82ff60ce3_m.jpg%0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.2.9%2F%24sce%2Finsecurl%3Fp0%3Dhttps%253A%252F%252Ffarm1.staticflickr.com%252F37%252F82749767_e82ff60ce3_m.jpg
minErr/<@http://localhost/scripts/angular.js:78
$interpolate/fn@http://localhost/scripts/angular.js:8254
$RootScopeProvider/this.$get</Scope.prototype.$digest@http://localhost/scripts/angular.js:11800
$RootScopeProvider/this.$get</Scope.prototype.$apply@http://localhost/scripts/angular.js:12061
done@http://localhost/scripts/angular.js:7843
completeRequest@http://localhost/scripts/angular.js:8026
createHttpBackend/</jsonpDone<@http://localhost/scripts/angular.js:7942
jsonpReq/doneWrapper@http://localhost/scripts/angular.js:8039
jsonpReq/script.onerror@http://localhost/scripts/angular.js:8053

错误：[$interpolate:interr]无法插入：{{p.url\u s}
错误：[$sce:UnsecUrl]阻止了从url加载资源，$SCEDegate策略不允许这样做。网址：https://farm1.staticflickr.com/37/82749767_e82ff60ce3_m.jpg
http://errors.angularjs.org/1.2.9/$sce/INSTECURL？p0=https%3A%2F%2Ffarm1.staticflickr.com%2F37%2F82749767\u e82ff60ce3\u m.jpg
http://errors.angularjs.org/1.2.9/$interpole/interr？p0=%7B%7Bp.url\u s%7D%7D&p1=错误%3A%20%5B%24sce%3asecurl%5D%20阻止%20加载%20resource%20%20url%20%24scedegate%20策略不允许%20%20url%3A%20https%3A%2F%2Ffarm1.staticflickr.com%2F37%2F82749767\u e82ff60ce3\u m.jpg%0Ahttp%3A%2F%2F%2F%2F%2Ferrors.angularjs.org%2f9%2Fecurl%3Fp0%3dthttps%253A%252F%252Ffarm1.staticflickr.com%252F37%252F82749767\u e82ff60ce3\u m.jpg
Miner/根据症状，第二页似乎有问题。在查看DOM之后，我注意到
a
和
img
标记有些奇怪。整个
img
标记似乎嵌入到
a
标记中

因此，我回到
html
标记，注意到缺少右括号。整个问题是由
a
标记未正确关闭引起的

我仍在试图理解AngularJS抛出的错误，以及它与错误标记的关系。
这可能是$sce的安全问题，我建议您看看。在底部，他们给出了如何完全关闭的示例，请尝试确保这是问题的根源。@1st4ck我禁用了它，错误消失了……但图像没有显示。网络监视器显示它甚至没有尝试出去加载它们。
Error: [$interpolate:interr] Can't interpolate: {{p.url_s}}
Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.  URL: https://farm1.staticflickr.com/37/82749767_e82ff60ce3_m.jpg
http://errors.angularjs.org/1.2.9/$sce/insecurl?p0=https%3A%2F%2Ffarm1.staticflickr.com%2F37%2F82749767_e82ff60ce3_m.jpg
http://errors.angularjs.org/1.2.9/$interpolate/interr?p0=%7B%7Bp.url_s%7D%7D&p1=Error%3A%20%5B%24sce%3Ainsecurl%5D%20Blocked%20loading%20resource%20from%20url%20not%20allowed%20by%20%24sceDelegate%20policy.%20%20URL%3A%20https%3A%2F%2Ffarm1.staticflickr.com%2F37%2F82749767_e82ff60ce3_m.jpg%0Ahttp%3A%2F%2Ferrors.angularjs.org%2F1.2.9%2F%24sce%2Finsecurl%3Fp0%3Dhttps%253A%252F%252Ffarm1.staticflickr.com%252F37%252F82749767_e82ff60ce3_m.jpg
minErr/<@http://localhost/scripts/angular.js:78
$interpolate/fn@http://localhost/scripts/angular.js:8254
$RootScopeProvider/this.$get</Scope.prototype.$digest@http://localhost/scripts/angular.js:11800
$RootScopeProvider/this.$get</Scope.prototype.$apply@http://localhost/scripts/angular.js:12061
done@http://localhost/scripts/angular.js:7843
completeRequest@http://localhost/scripts/angular.js:8026
createHttpBackend/</jsonpDone<@http://localhost/scripts/angular.js:7942
jsonpReq/doneWrapper@http://localhost/scripts/angular.js:8039
jsonpReq/script.onerror@http://localhost/scripts/angular.js:8053