Практические заметки: Jenkins создает мощный рабочий процесс автоматизации интерфейса.

Node.js внешний интерфейс сервер JavaScript модульный тест Jenkins Webpack

задний план

Разработка и развертывание интерфейса компании выполняются вручную. С расширением бизнеса скорость итерации проекта становится быстрее, количество персонала увеличивается, и выявляются различные проблемы. Эта статья представляет собой обмен опытом после изучения фронт- конец рабочего процесса автоматизации. Я поделюсь процессом создания автоматизированного рабочего процесса на основе Jenkins через простой случай. После создания этого рабочего процесса нам нужно только локально инициировать отправку git, остальную часть модульного теста, создание пакета, развертывание кода, напоминания по электронной почте и т. д. Все функции выполняются автоматически, что делает непрерывную интеграцию, непрерывную доставку и непрерывное развертывание простыми и легкими в эксплуатации и действительно решает многие проблемы ручного создания и развертывания.

Что такое Дженкинс?

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

Функция, которая будет реализована в этом случае

Локальный проект инициирует отправку git, а остальная часть модульного тестирования, упаковки и сборки, развертывания кода, напоминаний по электронной почте и т. д. выполняется автоматически.

Начинать

Готов к работе

  1. Сначала подготовьте проект. Я напрямую использую леса vue-cli для создания проекта. То же самое верно и для других технологических стеков, если это проект.

vue-cli生成的项目

vue-cli生成的项目
2. Создайте удаленный репозиторий git для этого проекта и отправьте в него локальный код. Облако кода, которое я использую здесь, github тоже самое.
3. Подготовьте сервер, к которому можно получить доступ из внешней сети.Вы также можете использовать свой собственный компьютер в качестве сервера.Убедитесь, что доступ к внешней сети возможен. Я использую Aliyun ubantu14.04 здесь.Кроме того, новички Aliyun могут получить бесплатный сервер на один месяц.Если вы не хотите тратить деньги, вы можете попробовать.
4. Настройте среду Java на сервере.

Установка и запуск Дженкинса

Под линуксом:Установите Дженкинс в Ubuntu 14.04
Под окнами:

  1. Загрузите последний военный файл с официального сайта Jenkins.
  2. бегатьjava -jar jenkins.warВот и все.

Инициализация Дженкинса

  1. Порт jenkins по умолчанию — 8080, который открывается в браузере после успешного запуска.
  2. После входа нас попросят ввести пароль администратора, откройте файл по указанному пути на веб-странице, скопируйте и вставьте пароль и введите его.
  3. Затем он установит необходимые плагины, выберет здесь значение по умолчанию и дождется завершения установки.
  4. Создайте учетную запись администратора.
  5. После того, как вышеописанное будет выполнено, вы увидите этот интерфейс.

Jenkins初始化完成

Создать задачу

  1. Нажмите, чтобы создать новую задачу
    新任务
  2. Выберите проект программного обеспечения в свободном стиле и дайте ему имя
    自由风格的软件项目

На данный момент основные приготовления завершены, мы установили Jenkins на сервер и запустили его, затем выполнили первоначальную настройку и создали новую задачу. Далее начинаем настраивать нужные нам функции.

Реализовать функцию git hook

Прежде всего, нам нужно реализовать функцию git hook, то есть, когда мы отправляем наш код в удаленные хранилища, такие как github/облако кода, jenkins может знать, что мы отправили код, что является предпосылкой автоматического построения и автоматического На складе настроен адрес интерфейса сервера Jenkins. При инициации локального push на удаленный склад удаленный склад инициирует запрос с параметрами на адрес интерфейса настроенного сервера Jenkins, и Jenkins начнет работать после получения.

  1. Откройте только что созданную задачу, выберите «Настроить», добавьте адрес удаленного склада, настройте логин, пароль и филиал.
    添加仓库地址
  2. Установите подключаемый модуль Generic Webhook Trigger (Управление системой — Управление подключаемыми модулями — Поиск подключаемого модуля Generic Webhook Trigger). Если список необязательных подключаемых модулей пуст, щелкните вкладку «Дополнительно» и замените URL-адрес сайта обновления на:http://mirror.xmission.com/jenkins/updates/update-center.jsonИ нажмите «Отправить и получить сейчас».
  3. Добавить триггер
    Подключаемый модуль триггера, установленный на шаге 2, является очень мощным и может запускать различные операции сборки в соответствии с различными параметрами триггера. Например, если я отправлю код основной ветки на удаленное хранилище, будет выполнена работа по развертыванию кода. отправить на удаленный склад. Для функциональной ветки выполняется модульный тест, и после того, как модульный тест пройден, он объединяется с веткой разработки. Гибкость очень высока, и вы можете настроить и настроить решение, подходящее для вашей компании.Здесь удобно продемонстрировать, что мы не делаем никаких условных суждений, пока есть представление, оно будет активировано. Отметьте Generic Webhook Trigger в конфигурации задачи.
    添加触发器
  4. ловушка конфигурации репозитория Возьмем в качестве примера Code Cloud, потому что компания использует Code Cloud, и конфигурация github в основном такая же.После входа на домашнюю страницу проекта Code Cloud нажмите Manage-webhooks-Add, и появится окно, подобное этому. вверх.
    仓库配置钩子
    Формат URL-адресаhttp://<User ID>:<API Token>@<Jenkins IP地址>:端口/generic-webhook-trigger/invokeИдентификатор пользователя и токен API находятся в управлении системой jenkins - управление пользователями - администратор - настройки, это мое
    URL格式
    IP-адрес и порт Jenkins — это IP-адрес, на котором вы развертываете сервер jenkins.Если номер порта не был изменен, это 8080.
    Введите пароль, соответствующий вашему идентификатору пользователя выше. Здесь я root.
    Следующие опции запускают хук при выполнении операции на складе, здесь push используется по умолчанию.
    Нажмите «Отправить», чтобы завершить настройку.
  5. тестовый крючок
    测试钩子
    Нажмите «Тест», и если конфигурация выполнена успешно, задача появится в статусе выполнения сборки Jenkins на левой боковой панели.

测试钩子
Кроме того, вы также можете попробовать отправить код локально.После отправки кода jenkins также запустит задачу.В настоящее время мы не настроили, что делать после запуска задачи, поэтому по умолчанию он будет только тянуть новый код после того, как вы отправите новый код, получите его на сервере jenkins. На данный момент настроен хук git.

GIF-рендеринг:

完整效果图

Внедряйте автоматизированные сборки

После того, как git push запустит хук, jenkins начнет работать.Существует множество видов автоматизированных задач сборки, таких как установка и обновление пакетов зависимостей, модульное тестирование, тестирование e2e, сжатие статических ресурсов, пакетное переименование и т. д., будь то скрипт npm. или Рабочие процессы, такие как webpack и gulp, которые вы могли выполнять локально раньше, также могут быть выполнены здесь.
В качестве демонстрации здесь показаны только три основных и распространенных рабочих процесса, установка пакетов зависимостей -> модульное тестирование -> упаковка, то есть следующие три команды.

npm install
npm run test
npm run build
  1. Прежде всего, как и при локальном запуске скрипта npm, если мы хотим выполнять команды npm в jenkins, мы должны сначала настроить среду узла в jenkins.Мы можем ввести узел, настроив переменные среды, или установить плагины, которые используются здесь В качестве плагинов установите плагин nvm wrapper.
  2. Откройте задачу jenkins прямо сейчас, щелкните среду сборки в конфигурации, проверьте это и укажите версию узла.
    构建环境
  3. Щелкните Build, введите команду для выполнения и используйте && для разделения нескольких команд.

执行的命令
4. Сохранить.
5. На этом этапе измените код локально, чтобы запустить тест (вы также можете щелкнуть, чтобы создать тест сейчас), щелкните задачу, запущенную на этот раз, выберите вывод консоли, и вы увидите процесс, выполняемый Jenkins в облаке. .
云端执行的过程
Последняя строка командной строки находится в состоянии Завершено.Если это УСПЕХ (синий), это доказывает, что все выполненные задачи выполняются гладко.Если это НЕУДАЧА (красный), это доказывает, что в середина, что приводит к сбою задачи.НЕСТАБИЛЬНЫЙ (желтый) означает, что есть небольшие проблемы.Но это не мешает выполнению задачи.Желтый или красный, вы можете перейти в командную строку, чтобы увидеть вывод ошибки чтобы увидеть, что пошло не так.
状态
6. Если предыдущий шаг УСПЕШЕН, щелкните рабочую область проекта, и вы найдете еще две папки, dist и node_modules.
文件夹

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

Автоматизируйте развертывание

Автоматическое развертывание может быть функцией, которая нам нужна больше всего.У компании есть только один сервер, и мы можем использовать ручное развертывание.Однако, если у компании 100 серверов, ручное развертывание будет немного трудоемким, и как только возникнет проблема в сети, его вернут.Прокатка тоже хлопот. Итак, в этом разделе реализована функция автоматического развертывания.

  1. Первым делом установим плагин Publish Over SSH на Jenkins, мы будем использовать этот инструмент для реализации функции развертывания сервера.
  2. Создайте папку на сервере, где вы хотите развернуть код для получения кода от Jenkins.Я создал папку testjenkins на сервере.
  3. Если Jenkins хочет развернуть код на сервере, вы должны войти на сервер. Существует два метода аутентификации входа: один — аутентификация ssh, а другой — аутентификация по паролю. Точно так же, как вы входите на свой сервер самостоятельно, вы можете использовать ssh вход без пароля., также можно каждый раз вводить пароль для входа, и найти пункт Publish over SSH в System Management - System Settings. Описание основных параметров:
Passphrase:密码(key的密码,没设置就是空)
Path to key:key文件(私钥)的路径
Key:将私钥复制到这个框中(path to key和key写一个即可)

SSH Servers的配置:
SSH Server Name:标识的名字(随便你取什么)
Hostname:需要连接ssh的主机名或ip地址(建议ip)
Username:用户名
Remote Directory:远程目录(上面第二步建的testjenkins文件夹的路径)

高级配置:
Use password authentication, or use a different key:勾选这个可以使用密码登录,不想配ssh的可以用这个先试试
Passphrase / Password:密码登录模式的密码
Port:端口(默认22)
Timeout (ms):超时时间(毫秒)默认300000

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

返回信息
4. Далее, чтобы войти в созданную нами задачу, нажмите Build, добавьте 2-строчный код, означающий упакованные вещи в Dist в файл, потому что мы хотим перенести.

cd dist&&
tar -zcvf dist.tar.gz *

增加2行代码
5. Нажмите «Операция после сборки», добавьте этапы операции после сборки, выберите «Отправить искусственную сборку через SSH». Описание параметра:

Name:选择一个你配好的ssh服务器
Source files :写你要传输的文件路径
Remove prefix :要去掉的前缀,不写远程服务器的目录结构将和Source files写的一致
Remote directory :写你要部署在远程服务器的那个目录地址下,不写就是SSH Servers配置里默认远程目录
Exec command :传输完了要执行的命令,我这里执行了解压缩和解压缩完成后删除压缩包2个命令

参数说明
6. Теперь, когда мыWelcome to Your Vue.js Appпревратиться вJenkinsВыдав git push, через какое-то время мы обнаружим, что на нашем сервере развёрнут последний код, очень 6?

效果

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

Реализуйте напоминания по электронной почте

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

  1. Откройте Управление системой-Конфигурация системы-Расширенное уведомление по электронной почте, а не Управление системой-Конфигурация системы-Уведомление по электронной почте, не совпадайте неправильно, иначе это не будет работать. Настройте почтовый ящик, используемый для отправки электронных писем. Здесь я использую свой собственный почтовый ящик QQ.
    邮箱
    Если вы пользуетесь сервисом почтовых ящиков других производителей, то можете проверить как используется конфигурация smtp почтовых ящиков других производителей.Кроме имени пользователя и пароля почтового ящика QQ, вы можете написать так же, как я написал. Кроме того, написанный пароль - это не пароль почтового ящика QQ, а пароль, полученный путем отправки текстового сообщения после включения службы smtp.
  2. Откройте созданную задачу, добавьте шаги операции после сборки и выберите «Редактируемое уведомление по электронной почте». В списке получателей проекта напишите адрес электронной почты, которому вы хотите отправить. Их может быть несколько, разделенных точкой с запятой.

邮件
Затем нажмите «Дополнительные настройки» — «Триггеры» — «Добавить триггер» и выберите «Всегда», что означает, что независимо от того, какая задача выполняется, электронная почта будет отправлена.Вы также можете выбрать другие режимы, например, отправка электронной почты при ненормальном выполнении задачи.

发邮件
Адрес, который я настраиваю здесь для получения электронных писем, также является моим почтовым ящиком QQ, который можно настроить в соответствии с рабочим процессом моей компании.
4. Теперь, когда мы изменим код локально и отправим git push, Jenkins отправит мне электронное письмо после завершения автоматической сборки и развертывания, а вложение электронной почты будет содержать журнал этой задачи.

qq邮件

На этом этапе также настроена наша функция напоминания по электронной почте.

Наконец

В приведенном выше случае мы создали набор простых автоматизированных рабочих процессов.Нам нужно только локально инициировать отправку git, а затем мы можем автоматизировать создание и развертывание в облаке, а также автоматически уведомлять о доставке и непрерывном развертывании. простота в эксплуатации, высвобождение производительности при строительстве и развертывании рабочей силы, а также унификация среды строительства. Реальная конфигурация онлайн-сервиса CI сложнее, чем это. Для общего процесса, пожалуйста, обратитесь к этой статье г-на Жуана Ифэна:

Что такое непрерывная интеграция?

Jenkins также имеет много мощных функций, таких как Pipeline, slave и т. д., и плагины также очень богаты, и экология сообщества также очень хороша.Если у компании нет возможности создавать службы CI самостоятельно, это хороший выбор для использования бесплатного Jenkins с открытым исходным кодом. Кроме того, если ваш проект является проектом с открытым исходным кодом, вы также можете использовать Travis CI для непрерывной интеграции.Эта конфигурация проще, чем Jenkins.Вы можете обратиться к этой статье Baidu EFE:

Интерфейсный проект с открытым исходным кодом непрерывной интеграции Трех мушкетеров



(Оригинальная аранжировка статьи, пожалуйста, укажите источник для перепечатки, если вы считаете, что статья вам полезна, ставьте лайк, спасибо~)