Node.js bir çekme isteği durum sunucusu oluşturma

  • Makale
  • Okumak için 7 dakika

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

Çekme isteği (PR) iş akışı, geliştiricilere, ve otomatikleştirilmiş araçlardan gelen kodları hakkında geri bildirim almak için bir fırsat sağlar. 3. taraf araçları ve Hizmetleri, PR durum API'sini kullanarak çekme isteği iş akışına katılabilir. bu makalede, bir Azure DevOps Services Git deposundaki pr 'ler doğrulanacak bir durum sunucusu oluşturma sürecinde size kılavuzluk eder. PR durumu hakkında daha fazla bilgi için bkz. çekme isteği durumundaki çekme isteği iş akışlarını özelleştirme ve genişletme.

Önkoşullar

  • Git deposu ile Azure DevOps bir kuruluş. Kuruluşunuz yoksa, serbest bir şekilde sınırsız özel git depolarında kodu karşıya yüklemek ve paylaşmak için kaydolun .
  • VS Code veya seçtiğiniz diğer kod düzenleyicisini yükler. bu kılavuzdaki yönergeler VS Code kullanır, ancak diğer kod düzenleyicilerde bulunan adımlar benzerdir.

Node.js'yi yükleme

Node.js yüklemek için, platformunuz için uygun olan LTS sürümünü indirin . İndirme, Node.js çalışma zamanını yerel makinenize yüklemek için çalıştırabileceğiniz bir yükleyici içerir. Node.js yüklerken, varsayılan olarak seçilen yüklemenin NPM Paket Yöneticisi bölümünü kaydettiğinizden emin olun.

Express kullanarak temel bir Web sunucusu oluşturma

Bu bölümdeki adımlarda, bir Web sunucusu oluşturulmasını kolaylaştıran bir dizi HTTP yardımcı yöntemi sağlayan Node.js için hafif bir Web çerçevesi olan Expresskullanılır. Bu çerçeve, çekme isteği olaylarını dinlemek için gereken temel işlevleri sağlar.

  1. Komut satırından, Web sunucunuz için yeni bir proje klasörü oluşturun.

    mkdir pr-server
cd pr-server

  2. npm initProje için yeni bir dosya oluşturmak için komutunu kullanın package.json .

    npm init

    Giriş noktası dışındaki tüm seçeneklere ait Varsayılanları kabul etmek için ENTER tuşuna basın. Bunu app.js olarak değiştirin

    entry point: (index.js) app.js

  3. Aşağıdaki komutu kullanarak Express 'ı PR-Server dizinine yüklersiniz. Bu, Express 'ı yükleyip bağımlılıklar listesine kaydeder.

    npm install express

  4. PR durum sunucusu için üzerine derlemek üzere basit bir Express uygulaması oluşturun. Aşağıdaki adımlar Express Hello World örneğinedayalıdır. klasöründen aşağıdaki komutu çalıştırarak VS Code proje klasörünü açın pr-server .

    code .

  5. Yeni bir dosya oluşturun (Ctrl + N) ve aşağıdaki örnek kodu yapıştırı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. Dosyayı app.js olarak kaydedin.

  7. Aşağıdaki komutu kullanarak temel Web sunucusunu çalıştırın:

    node app.js

    Sunucusunun çalıştığını doğrulayın http://localhost:3000/ .

HTTP POST isteklerini dinleyin

web sunucusu POST Azure DevOps Services isteklerini alacak, bu nedenle sunucunuzdaki bu istekleri işlemeniz gerekir.

  1. app.jsDosyanın sonuna aşağıdaki kodu ekleyin ve dosyayı kaydedin.

    app.post('/', function (req, res) {
    res.send('Received the POST')
})

  2. Aşağıdaki komutu kullanarak Web sunucunuzu yeniden çalıştırın:

    node app.js

PR olayları için bir hizmet kancası yapılandırma

hizmet kancaları, belirli olaylar gerçekleştiğinde dış hizmetleri uyarabilir bir Azure DevOps Services özelliğidir. Bu örnek için, çekme isteği olayları için iki hizmet kancaları kurmak isteyeceksiniz, bu nedenle durum sunucusuna bildirim uygulanabilir. İlki çekme isteği oluşturulan olay için, Ikincisi ise çekme isteği güncelleştirilmiş olay için olacaktır.

Hizmet kancası bildirimlerini almak için, genel İnternet 'e bir bağlantı noktası kullanıma sunmanız gerekir. Ngrok yardımcı programı, bunu geliştirme ortamında yapmak için çok yararlıdır.

  1. Platformunuz için uygun ngrok sürümünü indirip sıkıştırmasını açın.

  2. Örnek sunucu bağlantı noktası 3000 ile aynı bağlantı noktasını dinlemeye başlamak için ngrok kullanın. Yeni bir komut penceresinde aşağıdaki komutu çalıştırın.

    ngrok http 3000

    Ngrok, öğesine ileten ortak bir URL oluşturacak localhost:3000 . Sonraki adımda ihtiyacınız olacak URL 'YI unutmayın. Şuna benzer olacaktır:

    http://c3c1bffa.ngrok.io

  3. Azure DevOps, örneğin, projenize gidin.https://dev.azure.com/<your account>/<your project name>

  4. Gezinti menüsünde dişli ' ın üzerine gelin ve hizmet kancaları' nı seçin.

    Yönetici menüsünden hizmet kancalarını seçin

  5. Bu ilk hizmet kancası ise + abonelik oluştur' u seçin.

    Araç çubuğundan yeni abonelik oluştur ' u seçin

    Yapılandırılmış başka hizmet kancaları zaten varsa, (+) Yeni bir hizmet kancası aboneliği oluşturmak için yeşil Plus ' ı seçin.

    Yeni bir hizmet kancası aboneliği oluşturmak için yeşil Plus ' ı seçin.

  6. Yeni hizmet kancaları aboneliği iletişim kutusunda, hizmetler listesinden Web kancaları ' nı seçin ve ardından İleri' yi seçin.

    Hizmetler listesinden Web kancaları seçin

  7. Olay Tetikleyicileri listesinden oluşturulan çekme isteği ' ni seçin ve ardından İleri' yi seçin.

    Olay Tetikleyicileri listesinden oluşturulan çekme isteğini seçin

  8. Eylem sayfasında URL kutusuna ngrok adresınden URL 'yi girin. Sunucunuza bir test olayı göndermek için Test ' i seçin.

    Hizmet kancasını sınamak için URL 'YI girin ve testi seçin

    Ngrok konsol penceresinde, POST200 OK sunucunuzun hizmet kanca olayını aldığını belirten bir döndüren gelen ' ı görürsünüz.

    HTTP Requests
-------------

POST /                         200 OK

    Test bildirimi penceresinde, sunucunuzdaki Yanıtın ayrıntılarını görmek için yanıt sekmesini seçin. POST işleyicinizden dize uzunluğu ile eşleşen 17 içerik uzunluğunu görmeniz gerekir (yani "GÖNDERI alındı").

    Testin sonuçlarını görmek için yanıt sekmesini seçin

  9. Test bildirimi penceresini kapatın ve hizmet kancasını oluşturmak için son ' u seçin.

Adım 3-9 ' a yeniden ilerleyin, ancak bu sefer çekme isteği güncelleştirilmiş olayını yapılandırır.

Önemli

Yukarıdaki adımları iki kez seçtiğinizden emin olun ve hem çekme isteği oluşturma hem de çekme isteği güncelleştirilmiş olayları için hizmet kancaları oluşturun.

Durumu PR 'ler 'e gönder

Artık sunucunuz yeni PR 'ler oluşturulduğunda hizmet kancası olaylarını aladığına göre, durumu PR 'ye geri göndermek için güncelleştirin.

  1. Hizmet kancası istekleri, olayı açıklayan bir JSON yükü içerir. Hizmet kancası tarafından döndürülen JSON 'u ayrıştırmaya yardımcı olmak için, gövde ayrıştırıcı paketini yükledikten sonra.

    npm install body-parser

  2. app.jsAyrıştırma için Body-Parser kullanacak şekilde güncelleştirin application/json .

    var bodyParser = require('body-parser')

app.use(bodyParser.json())

  3. Azure Repos REST API çağrısı yapmayı kolaylaştırmak için Azure-devops-node-apı paketini yüklemek için.

    npm install azure-devops-node-api

  4. app.jsAzure-DevOps-node-API paketini kullanmak, hesabınıza bir bağlantı için ayrıntıları ayarlamak ve GIT API 'sinin bir örneğini almak için güncelleştirin.

    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. koleksiyon URL 'niz için bir ortam değişkeni oluşturun, <your account> Azure DevOps kuruluşunuzun adıyla değiştirin.

    setx COLLECTIONURL "https://dev.azure.com/<your account>"

  6. Aşağıdaki yönergeleri izleyerek uygulamanızın kullanması için kişisel bir kimlik doğrulama belirteci (PAT) oluşturun: kişisel erişim belirteçleriyle kimlik doğrulama. Hesabınıza erişmek için kullandığınız her hizmet için yeni bir PAT oluşturmanız ve bunu uygun şekilde adlandırmalısınız.

  7. PAT için bir ortam değişkeni oluşturun.

    setx TOKEN "yourtokengoeshere"

  8. post()Hizmet kancası yükündeki PR ayrıntılarını okumak için işlevi güncelleştirin. Durumun geri nakledilmesi için bu değerlere ihtiyacınız olacak.

    var repoId = req.body.resource.repository.id
var pullRequestId = req.body.resource.pullRequestId
var title = req.body.resource.title

  9. PR 'de gönderi yapmak için durum nesnesini oluşturun.

    State , Statetüründe bir Enum. Çekme isteğinin succeeded durum denetimini geçtiğini ve birleştirmeye hazırlandığını göstermek için kullanın.

    , Çekme isteği description ayrıntıları görünümündeki durum bölümü ve Etkinlik akışında kullanıcıya görüntülenecek bir dize değeridir.

    , targetUrl Durum bölümü ve Etkinlik akışında açıklama metni için bir bağlantı oluşturmak üzere kullanılacak BIR URL 'dir. Bu, kullanıcıların durum hakkında daha fazla bilgi (örneğin, bir yapı raporu veya test çalışması) almak için gidebileceği yerdir. Hiçbir URL belirtilmemişse, açıklama hiçbir bağlantı olmadan metin olarak görünür.

    Bağlam name ve genre Bu durum, durumu kategorilere ayırmak ve diğer hizmetlerin deftere nakil durumuyla ayırt etmek için kullanılır.

        var prStatus = {
        "state": "succeeded",
        "description": "Ready for review",
        "targetUrl": "https://visualstudio.microsoft.com",
        "context": {
            "name": "wip-checker",
            "genre": "continuous-integration"
        }
    }

  10. Durumu yalnızca tam olarak göndermek yerine, kullanıcının çekme isteği, succeeded başlığa succeeded ekleyerek bir iş iadesi olup OLMADıĞıNı görmek için PR başlığını inceleyin. Öyleyse, geri gönderilen durumu PR 'ye değiştirin.

        if (title.includes("WIP")) {
        prStatus.state = "pending"
        prStatus.description = "Work in progress"
    }

  11. Son olarak, yöntemini kullanarak durumu gönderin createPullRequestStatus() . Durum nesnesi, depo KIMLIĞI ve çekme isteği KIMLIĞI gerektirir. Post 'un sonucunu görebilmeniz için düğüm konsoluna giden yanıtı çıkış.

    vstsGit.createPullRequestStatus(prStatus, repoId, pullRequestId).then( result => {
    console.log(result)
})

  12. Elde edilen yöntem şuna benzer görünmelidir:

    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.jsDüğüm uygulamanızı kaydedin ve yeniden başlatın.

    node app.js

Durum sunucusunu sınamak için yeni bir PR oluştur

Sunucunuz çalışıyor ve hizmet kancası bildirimlerini dinlediğini göre, test etmek için bir çekme isteği oluşturun.

  1. Dosyalar görünümünden başlar. Bu readme.md (veya bir dosyanız yoksa başka bir dosya) readme.md.

    Bağlam menüsünden Düzenle'yi seçin

  2. Bir düzenleme yapın ve değişiklikleri bir repoya işin.

    Dosyayı düzenleyin ve araç çubuğundan İşle'yi seçin

  3. Sonraki adımda pr oluştur oluşturmak için değişiklikleri yeni bir dalda işleyenin.

    Yeni bir dal adı girin ve İşle'yi seçin

  4. Çekme isteği oluştur bağlantısını seçin.

    Öneri çubuğundan Çekme isteği oluştur'a seçin

  5. Uygulamanın işlevselliğini test etmek için başliğe WIP ekleyin. Pr'yi oluşturmak için Oluştur'a basın.

    Varsayılan PR başlığına WIP ekleme

  6. Pr oluşturulduktan sonra durum bölümünü ve yükte belirtilen URL'ye bağlantı oluşturan Devam ediyor girdisini görüntülersiniz.

    Devam eden iş girdisi olan durum bölümü.

  7. PR başlığını güncelleştirin ve WIP metnini kaldırın ve devam eden çalışma durumunda gözden geçirme için hazır olarak değişir.

Sonraki Adımlar

  • Bu makalede, hizmet kancaları aracılığıyla PR olaylarını dinleyen ve durum API'sini kullanarak durum iletileri gönderilebilecek bir hizmet oluşturma hakkında temel bilgileri öğrendinsiniz. Çekme isteği durum API'si hakkında daha fazla bilgi için REST API bakın.
  • Dış hizmet için dal ilkesi yapılandırma.