Delen via


Een statusserver voor pull-aanvragen maken met Node.js

Azure DevOps Services | Azure DevOps Server 2022 - Azure DevOps Server 2019

De pull-aanvraagwerkstroom (PR) biedt ontwikkelaars de mogelijkheid om feedback te krijgen over hun code van peers en van geautomatiseerde hulpprogramma's. Niet-Microsoft-hulpprogramma's en -services kunnen deelnemen aan de PR-werkstroom met behulp van de Status-API. In dit artikel wordt u begeleid bij het maken van een statusserver om PR's te valideren in een Git-opslagplaats van Azure DevOps Services. Voor meer informatie over de status van pull-aanvragen, zie Werkstromen voor pull-aanvragen aanpassen en uitbreiden met de status van pull-aanvragen.

Voorwaarden

  • Een organisatie in Azure DevOps met een Git-opslagplaats. Als u geen organisatie hebt, registreer u om code te uploaden en te delen in gratis privé-opslagplaatsen voor onbeperkte Git.
  • Installeer VS Code of een andere code-editor van uw keuze. De instructies in deze handleiding gebruiken VS Code, maar de stappen in andere code-editors zijn vergelijkbaar.

Node.js installeren

Als u Node.jswilt installeren, downloadt de LTS-versie die geschikt is voor uw platform. De download bevat een installatieprogramma dat u kunt uitvoeren om de Node.js runtime op uw lokale computer te installeren. Wanneer u Node.jsinstalleert, moet u ervoor zorgen dat u het onderdeel van de npm-pakketbeheerder behoudt als onderdeel van de installatie, dat standaard is geselecteerd.

Een eenvoudige webserver maken met Express

In de stappen in deze sectie wordt gebruikgemaakt van Express. Dit is een lichtgewicht webframework voor Node.js dat veel METHODEN voor HTTP-hulpprogramma's biedt die het maken van een webserver vereenvoudigen. Dit framework biedt u de basisfuncties die nodig zijn om te luisteren naar pr-gebeurtenissen.

  1. Maak vanaf de commandoregel een nieuwe projectmap voor uw webserver.

    mkdir pr-server
    cd pr-server
    
  2. Gebruik de opdracht npm init om een nieuw package.json-bestand voor het project te maken.

    npm init
    

    Selecteer Enter om de standaardwaarden voor alle opties te accepteren, met uitzondering van het toegangspunt. Wijzig deze in app.js

    entry point: (index.js) app.js
    
  3. Installeer Express in de pr-server map met behulp van de volgende opdracht. Hiermee wordt Express geïnstalleerd en opgeslagen in de lijst met afhankelijkheden.

    npm install express
    
  4. Maak een Express-app waarop u kunt voortbouwen voor de PR-statusserver. De volgende stappen zijn gebaseerd op het voorbeeld van Express Hello world. Open de projectmap in VS Code door de volgende opdracht uit te voeren vanuit de map pr-server.

    code .
    
  5. Maak een nieuw bestand (Ctrl + N) en plak de volgende voorbeeldcode.

    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. Sla het bestand op als app.js.

  7. Voer de basiswebserver uit met behulp van de volgende opdracht:

    node app.js
    

    Controleer of de server draait door naar http://localhost:3000/te gaan.

Luisteren naar HTTP POST-aanvragen

De webserver ontvangt POST aanvragen van Azure DevOps Services, dus u moet deze aanvragen op uw server afhandelen.

  1. Voeg aan het einde van het app.js-bestand de volgende code toe en sla het bestand op.

    app.post('/', function (req, res) {
        res.send('Received the POST')
    })
    
  2. Voer de webserver opnieuw uit met behulp van de volgende opdracht:

    node app.js
    

Een servicehook configureren voor pr-gebeurtenissen

Servicehook is een Azure DevOps Services-functie waarmee externe services kunnen worden gewaarschuwd wanneer bepaalde gebeurtenissen optreden. Stel voor dit voorbeeld twee servicehook in voor pr-gebeurtenissen, zodat de statusserver op de hoogte kan worden gesteld. De eerste gebeurtenis is voor de pull-aanvraag die is gemaakt en de tweede gebeurtenis is voor de pull-aanvraag die is bijgewerkt.

Als u meldingen van de servicehook wilt ontvangen, stelt u een poort beschikbaar op het openbare internet. Het hulpprogramma ngrok is handig om dit in een ontwikkelomgeving te doen.

  1. Download en pak de juiste ngrok-release uit voor uw platform.

  2. Gebruik ngrok om te beginnen met luisteren op dezelfde poort als uw voorbeeldserver - poort 3000. Voer de volgende opdracht uit in een nieuw opdrachtvenster.

    ngrok http 3000
    

    Ngrok maakt een openbare URL die wordt doorgestuurd naar localhost:3000. Noteer de URL, zoals u in de volgende stap nodig hebt. Het ziet er als volgt uit:

    http://c3c1bffa.ngrok.io
    
  3. Blader naar uw project in Azure DevOps, bijvoorbeeld https://dev.azure.com/<your account>/<your project name>

  4. Beweeg in het navigatiemenu de cursor over het tandwiel en selecteer Service Hooks.

    Schermopname toont Kies Servicelinks in het beheermenu.

  5. Mocht dit uw eerste servicehook zijn, selecteer dan + Abonnement aanmaken.

    De schermafbeelding toont de geselecteerde optie

    Als u al andere servicehook hebt geconfigureerd, selecteert u het plusteken (+) om een nieuw servicehookabonnement te maken.

    Schermopname toont het plusteken voor het maken van een nieuw servicehookabonnement.

  6. Selecteer in het dialoogvenster Nieuw servicekoppelingsabonnement Webkoppeling in de lijst met services en selecteer vervolgens Volgende.

    Schermopname toont geselecteerde webhooks in de lijst met services.

  7. Selecteer pull-aanvraag die is gemaakt in de lijst met gebeurtenistriggers en selecteer vervolgens Volgende.

    Schermopname toont de geselecteerde pull-aanvraag die is gemaakt op basis van de lijst met gebeurtenistriggers.

  8. Voer op de pagina Actie de URL van ngrok in het vak URL in. Selecteer Test om een test gebeurtenis naar uw server te verzenden.

    Schermopname toont de ingevoerde URL en de geselecteerde test om de servicehook te testen.

    In het consolevenster van ngrok retourneert een binnenkomende POST een 200 OK, waarmee wordt aangegeven dat uw server de servicehookgebeurtenis heeft ontvangen.

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

    Selecteer in het venster Testmelding het tabblad Antwoord om de details van het antwoord van uw server te bekijken. U ziet nu een inhoudslengte van 17 die overeenkomt met de lengte van de tekenreeks van uw POST-handler (bijvoorbeeld 'De POST ontvangen').

    Schermopname toont het geselecteerde antwoordtabblad voor de resultaten van de test.

  9. Sluit het testnotificatievenster en selecteer Voltooien om de servicehook te maken.

Voer stap 3-9 opnieuw uit, maar deze keer configureert u de Pull-aanvraag bijgewerkt gebeurtenis.

Belangrijk

Zorg ervoor dat u de voorgaande stappen twee keer doorloopt en servicehooks maakt voor zowel de gebeurtenis pull-verzoek aangemaakt als de gebeurtenis pull-verzoek bijgewerkt.

Status plaatsen naar pull requests

Nu uw server service hook gebeurtenissen kan ontvangen wanneer er nieuwe pull-aanvragen worden gemaakt, werkt u deze bij om de status terug te sturen naar de pull-aanvraag.

  1. Servicehookaanvragen bevatten een JSON-nettolading die de gebeurtenis beschrijft. Als u de JSON wilt parseren die door de servicehook wordt geretourneerd, installeert u het body-parser-pakket.

    npm install body-parser
    
  2. Werk app.js bij om body-parser te gebruiken voor het parsen van application/json.

    var bodyParser = require('body-parser')
    
    app.use(bodyParser.json())
    
  3. Installeer het azure-devops-node-api--pakket om het maken van REST API-aanroepen naar Azure-opslagplaatsen te vereenvoudigen.

    npm install azure-devops-node-api 
    
  4. Werk app.js bij om het azure-devops-node-api-pakket te gebruiken, de details voor een verbinding met uw account in te stellen en een exemplaar van de Git-API op te halen.

    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. Maak een omgevingsvariabele voor uw verzamelings-URL, waarbij u <your account> vervangt door de naam van uw Azure DevOps-organisatie.

    setx COLLECTIONURL "https://dev.azure.com/<your account>"
    
  6. Maak een persoonlijk verificatietoken (PAT) dat door uw app kan worden gebruikt. Volg hiervoor de volgende instructies: Verifiëren met persoonlijke toegangstokens. U moet een nieuwe PAT maken voor elke service die u gebruikt voor toegang tot uw account, waarbij u deze op de juiste manier een naam krijgt.

  7. Maak een omgevingsvariabele voor uw PAT.

    setx TOKEN "yourtokengoeshere"
    
  8. Werk de post()-functie bij om de PR-details van de payload van de servicehook te lezen. U hebt deze waarden nodig om de status terug te plaatsen.

    var repoId = req.body.resource.repository.id
    var pullRequestId = req.body.resource.pullRequestId
    var title = req.body.resource.title
    
  9. Bouw het statusobject om te plaatsen op de pull request.

    State is een opsomming van het type GitStatusState. Gebruik succeeded om aan te geven dat de PR de statuscontrole heeft doorgegeven en klaar is om te mergen.

    De description is een tekenreekswaarde die aan gebruikers wordt weergegeven in de Status-sectie en activiteitsfeed in de detailweergave van de pull request.

    De targetUrl is een URL die wordt gebruikt om een koppeling te maken voor de beschrijvingstekst in de sectie Status en activiteitsfeed, waar gebruikers meer informatie kunnen krijgen over de status, bijvoorbeeld een buildrapport of testuitvoering. Als er geen URL is opgegeven, wordt de beschrijving weergegeven als tekst zonder koppeling.

    De context name en genre worden gebruikt om de status te categoriseren en te onderscheiden van andere services die de status plaatsen.

        var prStatus = {
            "state": "succeeded",
            "description": "Ready for review",
            "targetUrl": "https://visualstudio.microsoft.com",
            "context": {
                "name": "wip-checker",
                "genre": "continuous-integration"
            }
        }
    
  10. In plaats van onmiddellijk de succeeded-status te plaatsen, controleert u de titel van de PR om te zien of de gebruiker heeft aangegeven dat de PR een werk in uitvoering is door WIP aan de titel toe te voegen. Als dat het geval is, wijzig dan de status die terug naar de pull-aanvraag is gepost.

        if (title.includes("WIP")) {
            prStatus.state = "pending"
            prStatus.description = "Work in progress"
        }
    
  11. Plaats ten slotte de status met behulp van de methode createPullRequestStatus(). Hiervoor zijn het statusobject, de opslagplaats-id en de pull-aanvraag-id vereist. Voer het antwoord uit naar de knooppuntconsole, zodat u het resultaat van het bericht kunt zien.

    vstsGit.createPullRequestStatus(prStatus, repoId, pullRequestId).then( result => {
        console.log(result)
    })
    
  12. De resulterende methode moet er ongeveer als volgt uitzien:

    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. Sla app.js op en start de knooppunt-app opnieuw.

    node app.js
    

Een nieuwe pull-aanvraag maken voor het testen van de statusserver

Nu uw server draait en luistert naar servicehook-meldingen, maakt u een pull-aanvraag aan om deze te testen.

  1. Begin in de bestandsweergave. Bewerk het readme.md bestand in uw opslagplaats (of een ander bestand als u geen readme.md hebt).

    Schermopname toont de geselecteerde knop Bewerken in het contextmenu.

  2. Breng een bewerking aan en voer de wijzigingen door in de opslagplaats.

    Schermopname toont het bewerken van het bestand en de geselecteerde knop Doorvoeren op de werkbalk.

  3. Zorg ervoor dat je de wijzigingen doorvoert in een nieuwe vertakking, zodat je in de volgende stap een pull request kunt maken.

    Schermopname toont de ingevoerde naam van de nieuwe vertakking en de geselecteerde knop Doorvoeren.

  4. Selecteer de Een pull-aanvraag maken koppeling.

    Schermopname toont de geselecteerde optie 'Pull request aanmaken' vanuit de suggestiebalk.

  5. Voeg WIP- toe aan de titel om de functionaliteit van de app te testen. Selecteer Maken om de pull request te maken.

    Schermopname toont toegevoegde WIP aan de standaardtitel van de pull request.

  6. Zodra de pull-aanvraag is gemaakt, wordt de statussectie weergegeven met de vermelding Bezig die is gekoppeld aan de URL die in de payload is opgegeven.

    Schermopname toont de statussectie met de vermelding Werk in uitvoering.

  7. Werk de titel van de pull request bij en verwijder de WIP tekst en houd er rekening mee dat de status verandert van Werk in uitvoering naar Klaar voor beoordeling.