Страницы GitHub с записи с использованием HTTP -запуска GitHub Actions

Github Pages является одним из самых популярных инструментов для разработчиков, когда речь заходит о статическом хостинге сайта. Но что, если содержимое не должно быть полностью статический? В этом посте я расскажу, как вы сможете сделать динамичный веб -сайт, работающий на страницах GitHub и GitHub, и объяснить гайки и болты того, как он работает. Лучше всего, это работает с бесплатной учетной записью GitHub!

Если вы тот, кто хочет поднять погоню и посмотреть, что можно построить, я сделал:

A Сайт загрузки простого изображения В
A Простой клон Pastebin и
Интегрировать это решение в мой сайт трекера моего доходов , где вы можете Отправьте другие компании, которые будут добавлены в списки доходов без какого -либо входа.

Объединение действий и страниц GitHub

GitHub позволяет вам создавать действия в вашем хранилище, это в основном потоки CI, которые могут (среди прочего) вносить изменения в файлы и совершать их обратно в репозиторий. Вы можете запустить действие, выполняемое одним из многих способов, но в этом посте мы сосредоточимся на [Repository_dispatch] (https://docs.github.com/en/actions/reference/events-that-rigger-workflows#repository_dispatch) , что позволяет запустить действие из HTTP -запроса в конечную точку API GitHub.

На GitHub вы также можете преобразовать свой репозиторий в полномасштабный статический веб-сайт бесплатно, используя страницы GitHub.

При сочетании этих двух функций GitHub нет, чтобы вы могли сделать поток данных, так что ваш веб -сайт на страницах GitHub:

Делает вызов HTTP, чтобы вызвать запуск действия
Это действие запускается, затем обновляет некоторые файлы в репо и
Обновление Repo повторно публикует сайт GitHub Pages.

Однако есть один барьер для этого подхода, аутентификация.

Запуск действия с [repository_dispatch] (https://docs.github.com/en/actions/reference/events-that-rigger-workflows#repository_dispatch) Требуется, чтобы вы передали токен носителя. Вы можете создать Пэт (личный токен доступа) И используйте это, однако, если бы вы опубликовали это на своем сайте GitHub Pages, это дало бы любому посетителю возможность изменить все ваши репо на GitHub. Таким образом, до тех пор, пока GitHub не добавит более жесткие элементы управления общеобразованием (в идеале конкретное репо и только разрешение на выполнение действий), мы должны использовать другой вариант, приложение GitHub.

Я создал приложение GitHub для поддержки этого потока, включая функцию Azure, необходимую для прокси -сервера запросов на GitHub. Это позволяет вам делегировать разрешение на выполнение действий в определенном репо в приложении GitHub, а затем сделать вызовы API в его конечную точку функции Azure, чтобы запустить [repository_dispatch] (https://docs.github.com/en/actions/reference/events-that-rigger-workflows#repository_dispatch) мероприятие. Если вы хотите раскрутить свою собственную версию приложения/функции, Источник доступен здесь Анкет

Что сейчас возможно

Примерно шаги следующие:

Установите Github приложение к вашему репо разрешить [Repository_dispatch] (https://docs.github.com/en/actions/reference/events-that-rigger-workflows#repository_dispatch) быть называться несанкционированным.
Добавьте вызов (например, ниже) как часть некоторого пользовательского действия на самом сайте GitHub.
Создайте действие GitHub в том же репо, которое принимает Repository_dispatch Триггер (запускается вызовом Fetch), измените некоторые данные, совершите их обратно в репозиторий, который обновит сайт GitHub Pages. Убедитесь, что Сделайте и протолкните шаг, обрабатывая повторение, чтобы разрешить одновременные прогоны и добавить немного Повторные шаги в случае неудачи рефейса Анкет

fetch("https://publicactiontrigger.azurewebsites.net/api/dispatches/{owner}/{repo}", {
  method: 'POST',
  mode: 'cors',
  body: JSON.stringify({ event_type: 'some-event', client_payload: { data: 'somedata' } })
});

Для тех из вас, кто предпочитает технически неверные, но своего рода разборчивые диаграммы, это то, что происходит за кулисами:

Ограничения

Страницы GitHub и GitHub не были точно разработаны с учетом этого варианта использования, так как есть некоторые ограничения, с которыми вы столкнетесь:

Обновления не мгновенные. Действие часто может занять 5-10 секунд, чтобы начать, а затем в зависимости от того, что ваше действие может занять 30 секунд, а затем еще 10-30 секунд для страниц GitHub, чтобы отразить изменения репо.
Размеры полезной нагрузки ограничены. Максимальный размер полезной нагрузки, который вы можете отправить в конечную точку/диспетчеры, ограничен GitHub до ~ 70 КБ. Вот моя справка о том, чтобы сделать это больше.
Отражающие обновления требуют кеша. Единственный способ для сеанса пользователей узнать, вступило ли в силу действие, – это запросить файл, который, как он знает, будет изменен, как только выполнение действия будет полным с другим параметром строки запроса. Простой способ сделать это – передать известный идентификатор (например, GUID) на вызов отправки, а затем написать его в файл в каталоге обслуживаемых страниц. Когда вы неоднократно писаете этот файл от клиента и получаете 200 ответа, вы знаете, что запуск действия преуспел Анкет
Параллельные действия ограничен в 20 Анкет Если ваши действия выполняются столько 10 секунд, вы можете установить максимум ~ 120 обновлений в минуту. Однако, если вы получите всплеск действий пользователя, есть потенциал, что некоторые будут отброшены и игнорируются GitHub (или запускаются позже, я не уверен, как GitHub обрабатывает предел параллелистики). Вы также можете столкнуться с проблемами масштабирования, пытаясь одновременно выдвинуть кучу коммитов, так как толчок потерпит неудачу, если голова будет обновлена с толкания в другом забеге, повторные данные могут помочь смягчить это Анкет
Внесение параллельных изменений в том же файле может быть сложным. Поскольку эти обновления работают независимо от отдельных бегунов действий, если они оба изменяют файл одновременно, шаг коммита и толчок в конце может выйти из строя из -за конфликта. Я изложены возможные решения для этого ниже.
Все Repostitory_disaptch Действия публично доступны без аттестации. Это означает, что эта архитектура обычно ориентирована на веб -сайты, где нет официальных учетных записей для пользователей, и все общедоступно.

Обработка параллелизма

Если все, что вам нужно,-это база данных с плоским файлом, которая будет обновляться, скажем, большой файл JSON или базу данных SQLite, вы, вероятно, столкнетесь с конфликтами, когда два обновления произойдут одновременно. Вот несколько подходов, которые вы можете использовать:

Продвигаясь с одним файлом

Одно потенциальное решение для этого – Создать несколько шагов повторной попытки . Так, что если вы нажимаете конфликт на шаге толкания, вы клонируете репо и запускаете обновление снова и снова. Это не оптимально, так как не гарантирует, что в конечном итоге будут внесены изменения (все повторения могут потерпеть неудачу), но это может ослабить часть бремени.

Перепроектирование вашей архитектуры как уникальных файлов

Если тип обновлений, которые вы делаете, может быть сделан независимо друг от друга, вы можете написать в разные файлы, и ваши действия не будут конфликтовать друг с другом. Это отлично подходит для тех случаев, когда пользователи предпринимают некоторые действия, и он может жить независимо от действий других пользователей. Вот как Пример загрузчика изображения работает.

Использование коллекций Джекилла

Хорошее сочетание отдельных файлов + перечисление их на веб -странице может быть сделано с помощью Jekyll Анкет Jekyll встроен в страницы GitHub, и вы можете использовать некоторые из его функций Чтобы перечислить коллекции данных на веб -странице Анкет Это подход, принятый в Pastebin Clone Я построил , где ты может просмотреть список всех общественных пастов Анкет

Что возможно

Этот поход открывает совершенно новый тип веб -сайта, который можно создать с помощью страниц GitHub. Вот пара идей для забавных, которые приходят на ум:

Обмен текстом – то есть пастбин/GitHub Gist
Обмен изображениями (из маленьких изображений) – т.е. Imgur (хотя попытка создать домашнюю страницу/поиск становится сложной с параллелизмом, загрузка изображения проста)
Состояние прототипирования веб -сайта – т.е. Codepen/jsfiddle
Содержится публично редактируемая музыкальная библиотека – то есть Стретто (Отказ от ответственности: еще один из моих проектов с открытым исходным кодом)
R/Place Clone (хотя одновременная пропускная способность может быть проблемой для сетки 1000x1000px, может работать на 100×100).

В дикой природе

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

Оригинал: “https://dev.to/benkaiser/writable-github-pages-using-http-triggered-github-actions-28j9”