我有一个Angular web应用程序部署到Heroku,从S3中抽取静态文件。我有RequireJS启用允许角度懒惰地加载控制器和模板。问题是,当应用程序加载时,window.location变量设置为myapp.heroku.com
,所以所有加载模板的角度请求都会尝试执行类似myapp.heroku.com/path/to/my/template.html
的操作,当我要它们执行此操作时mybucket.s3.amazon.com/path/to/my/template.html
。我不得不做一些小技巧来让RequireJS从S3而不是Heroku加载文件,但我似乎无法弄清楚如何修改Angular的$ http服务,以便所有请求都转到S3。任何帮助将不胜感激!
1
A
回答
0
我能够让Angular从S3加载模板而不是当前的主机!首先,一些在这里的科技我使用:
- RequireJS让我的应用程序的模块化
- 角
- 角UI路由器状态在应用
- 角AMD路由,以帮助调和角与RequireJS
的解决方案需要一个创造称之为config.js
一个RequireJS模块抓住配置直基本URL从像这样RequireJS:
define([], function(){
var baseUrl = require.s.contexts._.config.baseUrl;
var host = baseUrl.substring(0, baseUrl.indexOf('/', baseUrl.indexOf('://') + 3)) + "/";
return {
baseUrl : baseUrl,
hostUrl : host
}
});
由于我访问的并不是非常公开的RequireJS API,所以这有点冒失。 RequireJS的更高版本可能会改变您访问配置的方式。我导出baseURL和hostURL,因为它们都可能有用。现在
,我的模块中,实际上定义了所有的状态和模板的路线,我只是导入这个模块,并在前面加上hostUrl来给角UI路由器像这样的templateUrl:
define(['angularAMD', 'config'], function(angularAMD, config){
'use strict';
var host = config.hostUrl;
var routes = {};
routes.authenticated = {};
routes.unauthenticated = {};
routes.unauthenticated.splash = angularAMD.route({
name: 'splash',
url: '/splash',
templateUrl : host +'static/webpages/views/splash.html',
controller: 'splashController',
controllerUrl : 'controllers/splash'
});
return routes;
});
我们还没有完成。我们也有一个白名单的S3域在$ sceProvider像这样:
var app = angular.module('webapp', ['ui.router', 'LocalStorageModule']);
app.config(function($sceDelegateProvider){
$sceDelegateProvider.resourceUrlWhitelist([
// Allow same origin resource loads.
'self',
'https://mybucket.s3.amazonaws.com/**',
'https://mybucket.s3.amazonaws.com/**'
]);
});
我的错误的根源就来自RequireJS和AngularAMD可以串联使用加载JavaScript文件的事实,但他们不会为你加载HTML文件。 Angular和Angular UI路由器仍将负责加载模板。
相关问题
- 1. 在发送其他http请求之前发送http请求angular 2
- 2. 在任何其他请求之前发出$ http请求Angular JS
- 3. 发送http请求in Ionic with Angular http
- 4. 如何将HTTP POST请求发送到其他网站?
- 5. Angular发送一个http请求两次
- 6. 如何从其他应用程序向Ruby on Rails发送http请求?
- 7. 配置http请求spring mvc和angular js?
- 8. 我们可以通过蓝牙向其他Android手机发送位置请求...?
- 9. 发送HTTP请求
- 10. 发送HTTP请求
- 11. Java-Spring:如何向http url发送http请求?
- 12. 如何通过Angular向ASP.net web API发送发布请求
- 13. 如何将http请求从Docker发送到本地主机或虚拟机
- 14. 如何使用Firebase和Angular发送HTTP GET请求?
- 15. Java - 首先向特定主机发送http请求的速度明显较慢
- 16. 向其他域发送HTTP请求时在标头中丢失cookie
- 17. 从SilverLight向本地主机发出http请求
- 18. 发送无内容长度或其他标头的http请求
- 19. Angular $ http.post请求发送双重请求。
- 20. Wit.ai POST /发送HTTP请求
- 21. 同步发送http请求
- 22. 如何向HttpClient发送发布请求
- 23. 发送HTTP请求(验证请求)
- 24. 设置发送HTTP请求的时间
- 25. Android Developer Console如何发送HTTP请求?
- 26. 如何让Ajax.ActionLink发送Http Post请求?
- 27. 如何发送http请求c#
- 28. 如何发送'手写'的http请求?
- 29. 如何发送压缩的http请求?
- 30. 如何从mysql发送http请求?