Несколько доменов и поддоменов с помощью одного приложения Angular 7

Question

У меня есть идея для сайта, который я хочу создать сам. Я читал в документации, в статьях и в учебных пособиях. Но я не смог полностью найти ответы на свои вопросы.

Положение:

У меня есть проект на AWS Lightsail (в том числе: Angular 7, Node, MongoDB, Nginx, Express). У меня есть несколько доменных имен с динамическими поддоменами, которые используются для разграничения информации для сотрудников клиентов / брендов. Несколько доменов являются частью этого, чтобы облегчить навигацию и общение.

Например:

client1.domain1.com/some/info/
client1.domain2.com/some/info/
..etc.

Настройка:

Я настроил субдомены и домены через Nginx , чтобы он работал с субдоменами с подстановочными знаками, а также с декларированными субдоменами и доменами. Динамические субдомены настроены так:

server {
  listen 80;
  listen [::]:80;
  server_name ~^((?<sub>.*)\.)(?<domain>[^.]+)\.com$;
  root /opt/bitnami/nginx/html/$domain/$sub;
  try_files $uri $uri/ /index.html$is_args$args;
}

который выводит как этот каталог:

/opt/bitnami/nginx/html/domain1/client1/ 

(client1 находится там только для тестирования. В идеальном случае это не каталог, а domain1 & client1 должен быть только в URL-адресе в качестве самого домена и субдомена. Не в качестве каталога)

Мысли:

В идеале это будет одна система, на которую указывает каждый домен, а контент будет дифференцирован в зависимости от имени домена и клиента. Я думал о следующем:

• Создайте отдельное приложение для каждого домена. Но это дало бы много дублирующего кода и работало бы, чтобы поддерживать / делать изменения.
• Есть компонент для каждого домена. Но тогда я не знаю, как заставить работать маршрутизацию.
• Наличие нескольких приложений в одном проекте. Но Angular развертывает все в 1 HTML-файле с JavaScript. Как мне заставить работать там маршрутизацию?
• и др.

Но, похоже, никто не работает так, как я себе представляю. Как мне сделать это правильно? Как я смогу обслуживать приложение, используя несколько доменов, корректным, масштабируемым и безопасным способом?

Answer 1

Почему бы просто не использовать одно приложение с несколькими привязками домена, а затем использовать маршрутизацию внутри приложения для разделения контента.Предполагая, что никакая информация о безопасности клиента не жестко запрограммирована в угловом приложении, вы должны иметь возможность создать безопасное приложение, используя Angular Routeing в паре с веб-API, чтобы получить конечный результат, который вы описываете.

client1.domain1.com / client / 1 / info / client1.domain2.com/client/2/info/

clientx.domainx.com -> все разрешения для вашего приложения

/ client / -> маршрутык угловому компоненту

const routes: Routes = [
  {
    path: '',
    children: [ 
       { path: 'client/:id', component: dynamicClientComponent },
     ]
  }
];

В угловом клиентском компоненте вы получаете свой идентификатор клиента из URL-адреса и извлекаете специфическое для клиента содержимое из веб-службы / api

 constructor(
    private formBuilder: FormBuilder,
    private route: ActivatedRoute,
    private router: Router,
    private clientService: CientService,

  ) {
    route.params.subscribe(params => {
         this.id = this.route.snapshot.params.id;
         if (this.id) {
             this.clientService.getById(this.id).subscribe(
              (record) => {
                 this.ClientInfo = record;
                   //update UI accordingly

         })
    };
}

Вот рабочаяпример, который иллюстрирует это лучше, чем мой фрагмент кода https://stackblitz.com/edit/router-pillar1-demo-final?file=src%2Fapp%2Fapp.module.ts