angularjs – 如何使用ng-include指令与内容交付网络配合使用？

发布时间：2020-12-17 07:46:51 所属栏目：安全来源：网络整理

导读：是否可以获得ng-include指令与CDN协同工作？在这种情况下： div ng-include='http://cdn.somewebsite.com/templates/home.tpl.html'/div 网站site.com的cdn子域名通过DNS / CName映射到内容传送网络. 但是,当加载主站点atebsite.com时,它不会渲染模板.我猜

是否可以获得ng-include指令与CDN协同工作？

在这种情况下：

<div ng-include='http://cdn.somewebsite.com/templates/home.tpl.html'></div>

网站site.com的cdn子域名通过DNS / CName映射到内容传送网络.

但是,当加载主站点atebsite.com时,它不会渲染模板.我猜内部认为这是一个跨域呼叫.

有没有办法让Angular模板托管在第三方CDN上并与本地域合作？

是的,你是对的 – 问题在于跨域调用.
官方文件说：

By default,the template URL is restricted to the same domain and protocol as the application document. This is done by calling $sce.getTrustedResourceUrl on it. To load templates from other domains or protocols you may either whitelist them or wrap them as trusted values. Refer to Angular’s Strict Contextual Escaping.

和

Please note: The browser’s Same Origin Policy and Cross-Origin Resource Sharing (CORS) policy apply in addition to this and may further restrict whether the template is successfully loaded. This means that without the right CORS policy,loading templates from a different domain won’t work on all browsers.

例：

angular.module('myApp',[]).config(function($sceDelegateProvider) {
  $sceDelegateProvider.resourceUrlWhitelist([
    // Allow same origin resource loads.
    'self',// Allow loading from outer templates domain.
    'http://cdn.somewebsite.com/templates/**'
  ]); 
});

有用的网址：

> ngInclude
> $sce

所以您的问题可能会通过适当的角度设置来解决,但不适用于所有浏览器.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!