Рубрики
Uncategorized

Развернуть приложение React на свой сервер с Trvis CI

. Помечено ReactApp, Github, Trvis, CICD.

Первоначально опубликовано в Rharshad.com.

Трэвис CI Хозяин, распределенная непрерывная интеграционная служба, используемая для создания и тестирования программных проектов, размещенных в Github Отказ

Мы можем проверить и развернуть реагировать проекты, размещенные в GitHub, используя TRAVIS CI.

Предварительные условия

После того, как у вас есть свой React Project, размещенный на GitHub, зарегистрированном с TRUVIS CI, мы можем перейти к следующим шагам выполнения тестов и развертывать его на свой сервер, используя TRAVIS CI.

Установите TRAVIS CLI

Нам нужно разрешить TRAVIS на SSH на свой сервер, чтобы он мог развернуть артефакты сборки.

Тем не менее, мы не можем хранить закрытый ключ, как таковые в Github Refo, так как кто-либо может использовать его для входа в сервер.

Каждый репозиторий, который зарегистрирован в TRAVIS CI, имеет собственную клавиатуру, где закрытый ключ известен только Travis CI, а открытый ключ доступен для всех.

Мы можем использовать этот открытый ключ для шифрования ключа SSH и зафиксировать его на GitHub. Таким образом, только TRAVIS сможет расшифровать его и использовать дешифрованный SSH Cartain Countain, чтобы войти на свой сервер.

Эта функция предоставляется через Travis CLI. Следовательно, мы будем устанавливать то же самое, запустив следующие команды.

# travis cli is ruby based so we need to install ruby and other dev libraries
sudo yum install ruby -y

sudo yum install gcc g++ make automake autoconf curl-devel openssl-devel \
zlib-devel httpd-devel apr-devel apr-util-devel sqlite-devel -y

sudo yum install ruby-rdoc ruby-devel -y

# install travis cli
gem install travis

Если вы настраиваете TRAVIS CLI в вашей системе Windows, используя Git Bash Остерегайтесь этих вопросов —

Генерировать и шифровать закрытый ключ

Теперь мы собираемся генерировать ключ SSH и зашифровать его с помощью TRAVIS CLI, запустив несколько команд.

# travis login by providing your gihub username and password
travis login --com

# clone your react project and change directory to it
cd react-app

# create .travis.yml file
touch .travis.yml

# generate new key called "travis_rsa"
ssh-keygen -t rsa -N "" -C "React App" -f travis_rsa

# encrypt the file using your repo's public key and add it to your .travis.yml file
# must be run within your project directory
travis encrypt-file travis_rsa --add --com

# remove the key
rm travis_rsa

# stage .travis.yml and travis_rsa.enc files
git add .travis.yml
git add travis_rsa.enc

Если в случае инказы, когда вы работаете Шифра-файл Команда в вашем каталоге проекта, и ваше репо, не обнаруживается автоматически, вы можете пройти имя репо следующим образом

# use -r flag e.g. -r owner/project
travis encrypt-file travis_rsa --add --com -r HarshadRanganathan/react-app

Ваш файл .travis.yml выглядит следующим образом

before_install:
- openssl aes-256-cbc -K $encrypted_xxxxxx_key -iv $encrypted_xxxxxx_iv
  -in travis_rsa.enc -out travis_rsa -d

Вы можете найти Encrypted_xxxxxx_key. и Encrypted_xxxxxx_iv . хранится как Переменные среды Под настройками вашего проекта в Trvis CI.

Скопируйте открытый ключ в файл travis_rsa.pub который мы будем использовать дальше.

Создайте новый пользователь для TRAVIS на своем сервере

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

Мы будем добавлять открытый ключ ранее, сгенерированным этим пользователем, чтобы ТРЭС могла SSH на сервере, используя дешифрованный закрытый ключ.

Например, мы можем использовать команды ниже для создания нового пользователя в Cent OS.

# create a new travis user
sudo adduser travis

# delete the password for the user
sudo passwd -d travis

# change to travis user
su - travis

# create a new directory called .ssh and restrict its permissions
mkdir .ssh
chmod 700 .ssh

# open a file in .ssh called authorized_keys 
# copy the public key which we had previously generated
# enter :x then ENTER to save and exit the file
vi .ssh/authorized_keys

# restrict the permissions of the authorized_keys file
chmod 600 .ssh/authorized_keys

exit

Настройка .travis.yml.yml.

Мы собираемся сказать Travis CI, что делать с .travis.yml файл. Мы обновляем файл с подключением ниже.

sudo: true
language: node_js
node_js:
- node
git:
  quiet: true
cache: npm
before_install:
- openssl aes-256-cbc -K $encrypted_xxxxxx_key -iv $encrypted_xxxxxx_iv
  -in travis_rsa.enc -out travis_rsa -d
- chmod 600 travis_rsa
- mv travis_rsa ~/.ssh/id_rsa
- cat server.pub >> $HOME/.ssh/known_hosts
after_success:
- bash ./deploy.sh

Вот объяснение содержимого файла —

  • Sudo: правда Мы просим TRAVIS запустить сборку в виртуализированной машине с root доступ
  • язык: node_js Поскольку наш проект требует Node.js, мы говорим Travis CI, чтобы запустить сборку на инфраструктуре, имеющую Node.js установлен
  • Node_js: - Узел Определяет, чтобы использовать последний устойчивый выпуск Node.js
  • Кэш: NPM Определяет кэш Node_Modules каталог
  • Free_install Любые команды, которые мы хотим работать до процесса установки
  • mv travis_rsa ~/.ssh/id_rsa Переместите расшифрованный ключ к локации клавиш по умолчанию
  • After_success: - bash ./deploy.sh После того, как тесты проходят и сборки успешно завершится, мы просим TRAVIS запустить сценарий развертывания.

Когда мы указали язык: node_js Трэвис будет работать NPM установить Во время установки жизненного цикла и NPM тест во время жизненного цикла сценария.

Читать Node.js Руководство по языку и Работа с работой Больше подробностей.

Добавление в SSH известных хозяев

TRAVIS CI может добавлять записи в ~/.ssh/seleant_hosts до клонирования вашего репозитория Git, что необходимо, если есть подмодулы Git из доменов, кроме github.com, Gist.github.com или ssh.github.com.

Получите открытый ключ вашего сервера, запустив эту команду

ssh-keyscan (domain/ip_address)

Добавьте открытый ключ в файл с именем server.pub и подтолкнуть к вашему репо.

В файле .travis.yml мы указали эту команду Cat Server.pub >> $ Home/.ssh/известен_хосты Что добавит открытый ключ вашего сервера в файл известных хостов в виртуализированном автомате, созданном Travis CI.

Сценарий развертывания

Теперь добавьте ниже приведенное ниже сценарий для вашего проекта REPO, который выполняет следующее

  • Выполните скрипт только в том случае, если сборка для ветки или PR
  • Eval "$ (ssh-agent -s)" Запустите сеанс SSH-Agent
  • SSH-Add Добавляет клавиши по умолчанию ~/.ssh/ID_RSA в агент аутентификации SSH для реализации единого входа с SSH
  • NPM запустить сборку Создает производственную сборку JS, index.html файлов
  • rsync Удаленная синхронизация артефактов сборки. Мы удаляем любые файлы, если уже присутствующие и сделайте родительские каталоги в случае отсутствия.

Здесь $ Travis_build_dir/public Обозначает местоположение, в котором создаются ваши артефакты сборки (JS, index.html файлов).

#!/bin/bash
set -xe

if [ $TRAVIS_BRANCH == 'master' ] ; then
  eval "$(ssh-agent -s)"
  ssh-add
  npm run build
  rsync -rq --delete --rsync-path="mkdir -p react-app && rsync" \
  $TRAVIS_BUILD_DIR/public travis@:react-app
else
  echo "Not deploying, since this branch isn't master."
fi

SafeList Travis IP-адреса

Если Incase у вас установить ограничение SSH в правилах брандмауэра, вам придется сохранить IP-адреса TRAVIS, чтобы ТРЭС сможет SSH и развернуть артефакты на вашем сервере.

Обратитесь IP-адреса TRAVIS список.

Так как мы указали Sudo: правда В нашем файле .travis.yml мы должны сделать безопаснее Sudo включен Linux IP-адреса.

Также рекомендуется подписаться на уведомление о уведомлении, поскольку эти IP Adderesss будут периодически меняться.

Теперь у нас все на месте. Всякий раз, когда вы обновляете Мастер Филиал, Travis CI сгенерирует артефакты создания производства и развертывает их на ваш сервер, при условии пропускания тестов.

Оригинал: «https://dev.to/harshadranganathan/deploy-react-app-to-your-server-with-travis-ci-3212»

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