如何使用AngularJS从远程URL获取模板

我正在用NW和AngularJS做一个应用程序,使一个桌面应用程序,我想要的是从服务器(HTML,CSS,JS)的文件。

那么我想要做下面的代码:

aux.config(function ($routeProvider) { $routeProvider .when('/testInformation/', { templateUrl: 'https://serverName/test.html', controller: 'shipmentInformationController' }).otherwise({ redirectTo: '/' }); }); 

问题是,当我运行应用程序没有得到该模板的HTML,那么我不知道这个想法是否对AngularJs有效,或者如果我需要改变的逻辑,以获得HTML的内容。

我收到错误

错误:$ sce:insecurl处理来自不可信源的资源被阻止

谢谢你的帮助。

由于跨源资源共享规则,您无法直接从远程服务器加载内容。

一个相对简单的解决方法是使用Nginx之类的代理来使内容看起来像来自您自己的服务器。

如果您可以控制远程服务器,则可以简单地添加Access-Control-Allow-Origin标头。

我在互联网上做了一些search,发现了一个适合我的解决scheme。

这个想法是添加一个域,因为默认情况下,angularJs只支持相同的域,那么我们可以添加一个白名单与“$ sceDelegateProvider”像下面的代码

 .config(function ($sceDelegateProvider) { $sceDelegateProvider.resourceUrlWhitelist([ // Allow same origin resource loads. 'self', // Allow loading from our assets domain. Notice the difference between * and **. 'https://serverName.com/**' ]); }); 

之后当我们设置templateURL时,我们可以使用远程服务器。

 .when('/test1/', { templateUrl: 'https://serverName.com/html/test1.html', controller: 'test1'