Рубрики
Uncategorized

Маршрутизация на краю

В KOAN, Frontend нашего приложения — это одностраничное приложение React, работающее в двух разных … Tagged с AWS, Cloudskills, DevOps.

В Коан , Фронт нашего приложения — это Реагировать Приложение для одной страницы работа в двух отдельных средах (постановка и производство).

В дополнение к просмотру постановки и производственных версий нашего фронта, нам также необходимо обслуживать версию фронта, основанную на коммите GIT в нашей ставшей среде. Это дает разработчикам KOAN «Live Preview» URL для просмотра того, как выглядит Frondend после совершения изменений, но прежде чем они объединятся.

Наше решение

Наше решение имеет следующие шаги высокого уровня:

  1. Изменения кода объединяются в нашем Главный ответвляться. Это действие начинается с нашего Система CI
  2. CI строит код и помещает артефакты сборки (Static HTML/JavaScript/CSS -файлы) в ведра S3
  3. Cloudfront CDN находится перед одним из этих S3 ведра
  4. Наш стабильный домен приложений указан на эту облачную компанию CDN
  5. По всем запросам происхождения в домене приложения для постановки → a Lambda@Edge Function обслуживает специфичную для сборки index.html со статическими ссылками на остальную часть сборки

Более подробная информация об артефактах сборки

Наш процесс CI обеспечивает строительство артефактов в S3 AT /commit/[Commit sha] Анкет

Когда разработчик хочет «прожить» предварительно просмотреть »свой недавний коммит, им нужно добавить /Commit/<Их совершить SHA> К концу нашего домена постановки приложений.

Каждый index.html Файл в этом S3 Ссылки на ведра статические активы (файлы CSS/JS), размещенные в отдельном Поддомен-фронтальные строительства Анкет Этот домен указывал на второй CRODFRONT CDN со вторым ведром S3 в качестве его происхождения. Обслуживание в качестве удобных для CDN, неизменные активы экономит значительный вычислитель (деньги) для ресурсов, которые не нуждаются в лямбда@Edge.

Внутри функции Lambda «маршрутизатор»

Всякий раз, когда разработчик запрашивает конкретную версию приложения, запрос достигает CloudFront как Происхождение-запрос Анкет Наша функция Lambda@Edge получает Событие сообщения от Cloudfront, а затем продолжает делать следующее:

  1. Получает хэш для коммита GIT от пути в запросе. Если в URL нет хэша коммита, то мы предполагаем, что хотим последнюю версию.
  2. Получает запрошенный файл индекса
  3. Возвращает файл индекса в качестве тела для нашего ответа

Посмотрим какой -то код

Получает хэш коммита GIT от пути в запросе

Всякий раз, когда кто -то делает HTTP -запрос на CDN, CDN отправляет объект события в нашу функцию лямбда@Edge. Форма выглядит примерно как это Анкет

Затем мы тянем ПАТЕНАМА вне этого объекта события:

Теперь, когда у нас есть наш ПАТЕНАМА (включая необязательный Commit/ фрагмент), мы можем извлечь наш хэш Commit, позвонив Gethash вспомогательная функция.

Если в ПАТНА Это означает, что мы просто хотим обслуживать последнюю версию приложения, поэтому мы вернемся NULL Анкет

…

Получает запрошенный файл индекса

Теперь, когда у нас есть хэш -хэш в GIT (или null по умолчанию) из ПАТНА , давайте передадим этот Commit Hash в другую вспомогательную функцию, чтобы получить желаемый файл индекса из нашего ковша S3.

Переменные, которые начинаются с Process.env Являются ли Nodejs способ ссылаться на переменные среды на функцию Lambda. Мы устанавливаем эти переменные, когда функция была предоставлена.

Если объект S3 (файл index.html) отсутствует, мы обрабатываем это в поймать и войдите в систему ошибки.

Возможным следующим шагом для улучшения это может использоваться память лямбда@Edge. Поскольку индексный файл неизменен, нам нужно только извлечь его из S3 только один раз (или если оно сброшено). https://aws.amazon.com/blogs/networking-and-content-delivery/leveraging-external-data-in-lambdaedge/

…

Возвращает файл индекса в качестве тела для нашего ответа

Все вместе код функции будет выглядеть примерно так

Закрытие

Хотя есть возможности для улучшения, эта настройка хорошо работает для нашей команды, и мы подумали, что обмен этим подходом может дать вам и вашей команде некоторые идеи для использования.

Совсем недавно выпустил AWS Функции Cloudfront Анкет Следите за обновлениями, когда мы оцениваем, является ли это хорошим решением для нас использовать вместо наших существующих функций Lambda@Edge. Вполне возможно, что мы могли бы повторно архитектировать это, чтобы полностью обойти S3 GET и/или дополнительно использовать кэширование края.

Благодаря Даниэлю Качмарчику и Р.Дж. Заворски за просмотр черновиков этой статьи.

Оригинал: «https://dev.to/koan/routing-on-the-edge-3pn»

Читайте ещё по теме: