Создание сервера состояния запроса на включение внесенных изменений с Node.js

Azure Repos | Azure DevOps Server 2020 | Azure DevOps Server 2019 | TFS 2018

Рабочий процесс запроса на включение внесенных изменений предоставляет разработчикам возможность получать отзывы о коде с коллегами и из автоматизированных средств. сторонние средства и службы могут участвовать в рабочем процессе с помощью API состоянияPR. в этой статье описывается процесс создания сервера состояний для проверки вытягивание в репозитории Azure DevOps Services Git. Дополнительные сведения о состоянии запроса на вытягивание см. в разделе Настройка и расширение рабочих процессов запроса на включениевнесенных изменений.

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

  • организация в Azure DevOps с репозиторием Git. Если у вас нет организации, Зарегистрируйтесь для отправки и совместно используйте код в бесплатных неограниченных частных репозиториях Git.
  • установите VS Code или другой редактор кода по своему усмотрению. инструкции в этом руководстве используют VS Code но действия в других редакторах кода похожи.

Установка Node.js

Чтобы установить Node.js, Скачайте выпуск LTS, соответствующий вашей платформе. Загружаемый файл содержит установщик, который можно запустить для установки среды выполнения Node.js на локальном компьютере. При установке Node.js обязательно убедитесь в том, что NPM пакет диспетчера пакетов для установки выбран по умолчанию.

Создание базового веб-сервера с помощью Express

В этом разделе используется среда Express, которая представляет собой упрощенную веб-платформу для Node.js, предоставляющая ряд методов служебной программы HTTP, упрощающих создание веб-сервера. Эта платформа предоставляет базовые функции, необходимые для прослушивания событий PR.

  1. В командной строке создайте новую папку проекта для веб-сервера.

    mkdir pr-server
    cd pr-server
    
  2. Используйте npm init команду, чтобы создать новый package.json файл для проекта.

    npm init
    

    Нажмите клавишу ВВОД, чтобы принять значения по умолчанию для всех параметров, кроме точки входа. Укажите вместо него значение app.js.

    entry point: (index.js) app.js
    
  3. Установите Express в каталоге PR-Server с помощью следующей команды. Будет установлено Express и сохранена в списке зависимостей.

    npm install express
    
  4. Создайте простое приложение Express для создания сервера состояния запроса на вытягивание. Следующие шаги основаны на примере Express Hello World. откройте папку проекта в VS Code, выполнив следующую команду из pr-server папки.

    code .
    
  5. Создайте новый файл (Ctrl + N) и вставьте в него следующий пример кода.

    const express = require('express')
    const app = express()
    
    app.get('/', function (req, res) {
    res.send('Hello World!')
    })
    
    app.listen(3000, function () {
    console.log('Example app listening on port 3000!')
    })
    
  6. Сохраните файл как app.js.

  7. Запустите базовый веб-сервер с помощью следующей команды:

    node app.js
    

    Убедитесь, что сервер работает, перейдя по адресу http://localhost:3000/ .

Прослушивать запросы HTTP POST

веб-сервер будет принимать POST запросы от Azure DevOps Services, поэтому необходимо обрабатывайте эти запросы на сервере.

  1. В конце app.js файла добавьте следующий код и сохраните файл.

    app.post('/', function (req, res) {
        res.send('Received the POST')
    })
    
  2. Повторно запустите веб-сервер, выполнив следующую команду:

    node app.js
    

Настройка обработчика службы для событий PR

перехватчики служб — это Azure DevOps Services функция, которая может оповещать внешние службы при возникновении определенных событий. В этом примере необходимо настроить два перехватчика обслуживания для событий PR, чтобы сервер состояния мог получать уведомления. Первый будет для события создания запроса на вытягивание , а второй будет для события обновления запроса на вытягивание .

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

  1. Скачайте и распакуйте соответствующий выпуск ngrok для своей платформы.

  2. Используйте ngrok, чтобы начать прослушивание на том же порте, что и образец сервера — порт 3000. Выполните следующую команду в новом окне командной строки.

    ngrok http 3000
    

    Ngrok создаст общедоступный URL-адрес, который перенаправляется в localhost:3000 . Обратите внимание, что этот URL-адрес потребуется вам на следующем шаге. Он должен иметь примерно следующий вид:

    http://c3c1bffa.ngrok.io
    
  3. перейдите к проекту в Azure DevOps, напримерhttps://dev.azure.com/<your account>/<your project name>

  4. В меню навигации наведите указатель мыши на шестеренку и выберите перехватчики службы.

    Choose Service hooks from the admin menu

  5. Если это ваш первый обработчик службы, выберите + создать подписку.

    Select Create a new subscription from the toolbar

    Если вы уже настроили другие перехватчики событий, выберите зеленый плюс, (+) чтобы создать новую подписку на обработчик служб.

    Select the green plus to create a new service hook subscription.

  6. В диалоговом окне Новая подписка на перехватчики событий выберите веб-перехватчики в списке служб, а затем нажмите кнопку Далее.

    Select web hooks from the list of services

  7. Выберите запрос на вытягивание, созданный из списка триггеров событий, а затем нажмите кнопку Далее.

    Select pull request created from the list of event triggers

  8. На странице действие введите URL-адрес из ngrok в поле URL-адрес . Выберите тест , чтобы отправить тестовое событие на сервер.

    Enter the URL and select Test to test the service hook

    В окне консоли ngrok вы увидите входящий результат, POST200 OK указывающий, что сервер получил событие обработчика службы.

    HTTP Requests
    -------------
    
    POST /                         200 OK
    

    В окне Тестовое уведомление перейдите на вкладку ответ, чтобы просмотреть подробные сведения о ответе сервера. Должна отобразиться длина содержимого 17, совпадающая с длиной строки из обработчика POST (например, Received POST).

    Select the response tab to see the results of the test

  9. Закройте окно тестового уведомления и нажмите кнопку Готово , чтобы создать обработчик службы.

Выполните шаги 3-9 снова, но на этот раз настройте событие обновления запроса на вытягивание .

Важно!

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

Опубликовать состояние в вытягивание

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

  1. Запросы к обработчику служб включают полезные данные JSON, описывающие событие. Чтобы упростить анализ JSON, возвращенного обработчиком службы, установите пакет синтаксического анализа текста .

    npm install body-parser
    
  2. Обновите app.js , чтобы использовать средство синтаксического анализа текста для синтаксического анализа application/json .

    var bodyParser = require('body-parser')
    
    app.use(bodyParser.json())
    
  3. чтобы упростить выполнение REST API вызовов Azure Repos, установите пакет Azure-devops-node-API .

    npm install azure-devops-node-api 
    
  4. Обновите app.js для использования пакета Azure-devops-node-API, настройте сведения для подключения к учетной записи и получите экземпляр API Git.

    const vsts = require("azure-devops-node-api")
    
    const collectionURL = process.env.COLLECTIONURL    
    const token = process.env.TOKEN
    
    var authHandler = vsts.getPersonalAccessTokenHandler(token)
    var connection = new vsts.WebApi(collectionURL, authHandler)
    
    var vstsGit = connection.getGitApi().then( 
        vstsGit => {                                    
            vstsGit.createPullRequestStatus(prStatus, repoId, pullRequestId).then( result => {
                console.log(result);
            },
            error => {
                console.log(error);
            })
        }, 
        error => { 
            console.log(error);
        } 
    );
    
  5. создайте переменную среды для URL-адреса коллекции, заменив <your account> именем организации Azure DevOps.

    setx COLLECTIONURL "https://dev.azure.com/<your account>"
    
  6. Создайте личный маркер проверки подлинности (PAT) для использования приложением, выполнив следующие инструкции: Проверка подлинности с помощью личных маркеров доступа. Следует создать новый PAT для каждой службы, используемой для доступа к учетной записи, назвав ее соответствующим образом.

  7. Создайте переменную среды для вашего PAT.

    setx TOKEN "yourtokengoeshere"
    
  8. Обновите post() функцию для чтения сведений о прочтении из полезных данных перехватчика службы. Эти значения понадобятся для обратной передачи состояния.

    var repoId = req.body.resource.repository.id
    var pullRequestId = req.body.resource.pullRequestId
    var title = req.body.resource.title
    
  9. Создайте объект Status для POST на запрос на вытягивание.

    State является перечислением типа State. Используйте succeeded , чтобы указать, что запрос на вытягивание прошел проверку состояния и готов к слиянию.

    description— Это строковое значение, которое будет отображаться для пользователя в разделе состояния и на веб-канале действий в представлении сведений о прочтении.

    targetUrl— Это URL-адрес, который будет использоваться для создания ссылки на текст описания в разделе состояния и на веб-канале действий. Это место, где пользователи могут перейти для получения дополнительных сведений о состоянии, например отчет о сборке или тестовый запуск. Если URL-адрес не указан, описание будет отображаться как текст без связи.

    Контекст name и genre используется для категоризации состояния и различения его от других служб.

        var prStatus = {
            "state": "succeeded",
            "description": "Ready for review",
            "targetUrl": "https://visualstudio.microsoft.com",
            "context": {
                "name": "wip-checker",
                "genre": "continuous-integration"
            }
        }
    
  10. Вместо того succeeded , чтобы просто опубликовать состояние, проверьте заголовок запроса на вытягивание, чтобы узнать, указывает ли пользователь на то, что в процессе работы, добавление succeeded к заголовку. Если это так, измените состояние, отправленное обратно в поле PR.

        if (title.includes("WIP")) {
            prStatus.state = "pending"
            prStatus.description = "Work in progress"
        }
    
  11. Наконец, опубликуйте состояние с помощью createPullRequestStatus() метода. Для этого требуется объект status, идентификатор репозитория и идентификатор запроса на вытягивание. Выводит ответ на консоль узла, чтобы можно было увидеть результат записи.

    vstsGit.createPullRequestStatus(prStatus, repoId, pullRequestId).then( result => {
        console.log(result)
    })
    
  12. Полученный метод должен выглядеть примерно так:

    app.post("/", function (req, res) {
    
        // Get the details about the PR from the service hook payload
        var repoId = req.body.resource.repository.id
        var pullRequestId = req.body.resource.pullRequestId
        var title = req.body.resource.title
    
        // Build the status object that we want to post.
        // Assume that the PR is ready for review...
        var prStatus = {
            "state": "succeeded",
            "description": "Ready for review",
            "targetUrl": "https://visualstudio.microsoft.com",
            "context": {
                "name": "wip-checker",
                "genre": "continuous-integration"
            }
        }
    
        // Check the title to see if there is "WIP" in the title.
        if (title.includes("WIP")) {
    
            // If so, change the status to pending and change the description.
            prStatus.state = "pending"
            prStatus.description = "Work in progress"
        }
    
        // Post the status to the PR
        vstsGit.createPullRequestStatus(prStatus, repoId, pullRequestId).then( result => {
            console.log(result)
        })
    
        res.send("Received the POST")
    })
    
  13. Сохраните app.js и перезапустите приложение узла.

    node app.js
    

Создание нового запроса на вытягивание для проверки сервера состояния

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

  1. Откройте представление файлы. Измените файл readme.md в репозитории (или любой другой файл, если у вас нет readme.md).

    Select Edit from the context menu

  2. Выполните изменение и зафиксируйте изменения в репозитории.

    Edit the file and select Commit from the toolbar

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

    Enter a new branch name and select Commit

  4. Выберите ссылку создать запрос на вытягивание .

    Select Create a pull request from the suggestion bar

  5. Добавьте WIP в заголовок, чтобы проверить функциональность приложения. Выберите создать , чтобы создать запрос на вытягивание.

    Add WIP to the default PR title

  6. После создания запроса на вытягивание вы увидите раздел Status с записью о ходе работы , которая ссылается на URL-адрес, указанный в полезных данных.

    Status section with the Work in progress entry.

  7. Обновите заголовок запроса на вытягивание и удалите текст WIP и обратите внимание, что состояние изменится с " выполняемая работа " на " готов к проверке".

Следующие шаги