Question

我在一个使用多个（很多）服务器开发解决方案的环境中工作。他们的微服务风格是榜样。

为了能够升级系统，它们必须在运行时可切换/可替换（包括用户界面）。已经确定的主要解决方案是

门户/代理是最终用户唯一可见的系统
代理是＆＃34;意识到＆＃34; af支持服务器
代理有一些基本的用户界面，例如menues。可能与子系统（菜单中的几个条目等）合作。
用户请求包含某些动态内容的页面
门户网站中继/代理＆＃34;内容＆＃34;子系统页面的一部分。
客户端所需的任何REST调用也通过主服务器代理。

REST调用当然非常简单，但我在Angular中非常难以理解如何制作＆＃34; mix。第5点当然是艰难的部分。如果子服务器可见，则可以使用iframe（eeek！）但不是在这种情况下。

我需要某种＆＃34;授权＆＃34;在一个页面内，以前做过什么？微服务旗舰如何处理用户界面？

Answer 1

我现在已经从n00b演变为n00b ++关于Angular。

解决方案位于Angular中用于模板的HTML片段中。

我可以使用JS文件和HTML文件定义html模板。 JS文件通过URL引用HTML页面。通常（在我看过的样本中）路径是相对的：

angular.module('myApp.view1', ['ngRoute'])
.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/view1', {
    templateUrl: 'view1/view1.html',
    controller: 'View1Ctrl'
  });
}])
.controller('View1Ctrl', [function() {}]);

但是通过使用绝对路径，我可以引用外部资源：

angular.module（'myApp.view2'，['ngRoute']）

.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/view2', {
    templateUrl: host + '/app/view2/view2.html',
    controller: 'View2Ctrl'
  });
}])
.controller('View2Ctrl', [function() {}]);

注意我添加了一个参数'host'，通过查看包含此JS文件的脚本标记来计算。

var scripts = document.getElementsByTagName('script');
var src = scripts[scripts.length - 1].src;
var host = src.match(new RegExp('https?://[^/]*'))[0];

但要解决的第三个问题是处理CORS问题。在我的测试环境（node.js + express）中，我刚刚添加了'cors'库，我可以访问我的“外部”站点。

var express = require('express'), 
    cors = require('cors'), 
    app = express();

app.use(cors());
app.use("/", express.static(__dirname));

app.listen(8001, function(){
    console.log('CORS-enabled web server listening on port', 8001);
});

如何创建委派的Angular多主机站点？

1 个答案: