Membuat server status permintaan pull dengan Node.js

Artikel
04/04/2024

Layanan Azure DevOps | Azure DevOps Server 2022 - Azure DevOps Server 2019

Alur kerja permintaan pull (PR) memberi pengembang kesempatan untuk mendapatkan umpan balik tentang kode mereka dari rekan-rekan serta dari alat otomatis. Alat dan layanan pihak ke-3 dapat berpartisipasi dalam alur kerja PR dengan menggunakan PR Status API. Artikel ini memandu Anda melalui proses pembuatan server status untuk memvalidasi PR di repositori Git Azure DevOps Services. Untuk informasi selengkapnya tentang status PR, lihat Menyesuaikan dan memperpanjang alur kerja permintaan pull dengan status permintaan pull.

Prasyarat

Organisasi di Azure DevOps dengan repositori Git. Jika Anda tidak memiliki organisasi, daftar untuk mengunggah dan berbagi kode di repositori Git privat tanpa batas gratis.
Instal Visual Studio Code atau editor kode lain pilihan Anda. Instruksi dalam panduan ini menggunakan Visual Studio Code tetapi langkah-langkah di editor kode lain serupa.

Menginstal Node.js

Untuk menginstal Node.js, unduh rilis LTS yang sesuai untuk platform Anda. Unduhan berisi alat penginstal, yang dapat Anda jalankan untuk menginstal runtime Node.js di komputer lokal Anda. Saat menginstal Node.js, pastikan untuk menyimpan bagian pengelola paket npm dari penginstalan, yang dipilih secara default.

Membuat server web dasar menggunakan Express

Langkah-langkah di bagian ini menggunakan Express, yang merupakan kerangka kerja web ringan untuk Node.js yang menyediakan sejumlah metode utilitas HTTP yang menyederhanakan pembuatan server web. Kerangka kerja ini memberi Anda fungsi dasar yang diperlukan untuk mendengarkan peristiwa PR.

Dari baris perintah, buat folder proyek baru untuk server web Anda.
```
mkdir pr-server
cd pr-server
```
npm init Gunakan perintah untuk membuat file baru package.json untuk proyek.
```
npm init
```
Tekan Enter untuk menerima default untuk semua opsi kecuali titik entri. Ubah menjadi app.js
```
entry point: (index.js) app.js
```
Instal Express di direktori pr-server menggunakan perintah berikut. Ini menginstal Express dan menyimpannya ke daftar dependensi.
```
npm install express
```
Buat aplikasi Express sederhana untuk dibangun untuk server status PR. Langkah-langkah berikut didasarkan pada contoh dunia Express Hello. Buka folder proyek di VISUAL Code dengan menjalankan perintah berikut dari pr-server folder .
```
code .
```

Buat file (Ctrl + N) baru dan tempelkan dalam kode sampel berikut.

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!')
})

Simpan file sebagai app.js.
Jalankan server web dasar menggunakan perintah berikut:
```
node app.js
```
Verifikasi server berjalan dengan menelusuri ke http://localhost:3000/.

Mendengarkan permintaan HTTP POST

Server web akan menerima POST permintaan dari Azure DevOps Services, jadi Anda perlu menangani permintaan tersebut di server Anda.

Di akhir app.js file, tambahkan kode berikut, dan simpan file.

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

Jalankan kembali server web Anda menggunakan perintah berikut:
```
node app.js
```

Mengonfigurasi hook layanan untuk peristiwa PR

Kait layanan adalah fitur Azure DevOps Services yang dapat memperingatkan layanan eksternal saat peristiwa tertentu terjadi. Untuk sampel ini, Anda mungkin ingin menyiapkan dua hook layanan untuk peristiwa PR, sehingga server status dapat diberi tahu. Yang pertama adalah untuk peristiwa permintaan Pull yang dibuat dan yang kedua adalah untuk peristiwa yang diperbarui permintaan Pull.

Untuk menerima pemberitahuan hook layanan, Anda harus mengekspos port ke internet publik. Utilitas ngrok sangat berguna untuk melakukan ini di lingkungan pengembangan.

Unduh dan unzip rilis ngrok yang sesuai untuk platform Anda.
Gunakan ngrok untuk mulai mendengarkan pada port yang sama dengan server sampel Anda - port 3000. Jalankan perintah berikut di jendela perintah baru.
```
ngrok http 3000
```
Ngrok akan membuat URL publik yang diteruskan ke localhost:3000. Perhatikan bahwa URL karena Anda akan membutuhkannya di langkah berikutnya. Respons akan terlihat seperti ini:
```
http://c3c1bffa.ngrok.io
```
Telusuri ke proyek Anda di Azure DevOps, misalnya. https://dev.azure.com/<your account>/<your project name>
Dari menu navigasi, arahkan mouse ke atas gigi dan pilih Service Hooks.
Jika ini adalah hook layanan pertama Anda, pilih + Buat langganan.

Jika Anda sudah memiliki kait layanan lain yang dikonfigurasi, pilih plus (+) hijau untuk membuat langganan hook layanan baru.
Pada dialog Langganan Hook Layanan Baru, pilih Web Hook dari daftar layanan, lalu pilih Berikutnya.
Pilih Permintaan pull yang dibuat dari daftar pemicu peristiwa, lalu pilih Berikutnya.
Di halaman Tindakan, masukkan URL dari ngrok di kotak URL . Pilih Uji untuk mengirim peristiwa pengujian ke server Anda.

Di jendela konsol ngrok, Anda akan melihat yang masuk POST yang mengembalikan 200 OK, yang menunjukkan server Anda menerima peristiwa hook layanan.
```
HTTP Requests
-------------

POST /                         200 OK
```
Di jendela Pemberitahuan Pengujian, pilih tab Respons untuk melihat detail respons dari server Anda. Anda akan melihat panjang konten 17 yang cocok dengan panjang string dari handler POST Anda (yaitu "Diterima POST").
Tutup jendela Pemberitahuan Pengujian, dan pilih Selesai untuk membuat hook layanan.

Lanjutkan langkah 3-9 lagi tetapi kali ini konfigurasikan peristiwa yang diperbarui permintaan Pull.

Penting

Pastikan untuk melalui langkah-langkah sebelumnya dua kali dan buat kait layanan untuk permintaan Pull yang dibuat dan Peristiwa yang diperbarui permintaan Pull.

Posting status ke PR

Sekarang setelah server Anda dapat menerima peristiwa hook layanan saat PR baru dibuat, perbarui untuk memposting kembali status ke PR.

Permintaan hook layanan termasuk payload JSON yang menjelaskan peristiwa tersebut. Untuk membantu mengurai JSON yang dikembalikan oleh kait layanan, instal paket pengurai isi.
```
npm install body-parser
```
Perbarui app.js untuk menggunakan pengurai isi untuk mengurai application/json.
```
var bodyParser = require('body-parser')

app.use(bodyParser.json())
```
Untuk menyederhanakan melakukan panggilan REST API ke Azure Repos, instal paket azure-devops-node-api .
```
npm install azure-devops-node-api 
```

Perbarui app.js untuk menggunakan paket azure-devops-node-api, siapkan detail untuk koneksi ke akun Anda, dan dapatkan instans 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);
    } 
);

Buat variabel lingkungan untuk URL koleksi Anda, ganti <your account> dengan nama organisasi Azure DevOps Anda.
```
setx COLLECTIONURL "https://dev.azure.com/<your account>"
```
Buat token autentikasi pribadi (PAT) untuk digunakan aplikasi Anda, ikuti instruksi berikut: Mengautentikasi dengan token akses pribadi. Anda harus membuat PAT baru untuk setiap layanan yang Anda gunakan untuk mengakses akun Anda, penamaannya dengan tepat.
Buat variabel lingkungan untuk PAT Anda.
```
setx TOKEN "yourtokengoeshere"
```
post() Perbarui fungsi untuk membaca detail PR dari payload hook layanan. Anda akan memerlukan nilai-nilai ini untuk memposting kembali status.
```
var repoId = req.body.resource.repository.id
var pullRequestId = req.body.resource.pullRequestId
var title = req.body.resource.title
```
Buat objek status untuk diposting di PR.

State adalah enum jenis GitStatusState. Gunakan succeeded untuk menunjukkan bahwa PR telah melewati pemeriksaan status dan siap untuk menggabungkan.

description adalah nilai string yang akan ditampilkan kepada pengguna di bagian Status dan umpan aktivitas dalam tampilan detail PR.

targetUrl adalah URL yang akan digunakan untuk membuat tautan untuk teks deskripsi di bagian Status dan umpan aktivitas. Ini adalah tempat di mana pengguna dapat pergi untuk mendapatkan informasi selengkapnya tentang status, misalnya, laporan build atau eksekusi pengujian. Jika tidak ada URL yang ditentukan, deskripsi akan muncul sebagai teks tanpa tautan.

Konteks name dan genre digunakan untuk mengategorikan status dan membedakannya dari status posting layanan lain.
```
    var prStatus = {
        "state": "succeeded",
        "description": "Ready for review",
        "targetUrl": "https://visualstudio.microsoft.com",
        "context": {
            "name": "wip-checker",
            "genre": "continuous-integration"
        }
    }
```
Alih-alih hanya memposting succeeded status secara membabi buta, periksa judul PR untuk melihat apakah pengguna telah menunjukkan apakah PR sedang berlangsung dengan menambahkan WIP ke judul. Jika demikian, ubah status yang diposting kembali ke PR.
```
    if (title.includes("WIP")) {
        prStatus.state = "pending"
        prStatus.description = "Work in progress"
    }
```
Terakhir, posting status menggunakan createPullRequestStatus() metode . Ini memerlukan objek status, ID repositori, dan ID permintaan pull. Keluarkan respons ke konsol simpul sehingga Anda dapat melihat hasil postingan.
```
vstsGit.createPullRequestStatus(prStatus, repoId, pullRequestId).then( result => {
    console.log(result)
})
```

Metode yang dihasilkan akan terlihat seperti ini:

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")
})

Simpan app.js dan mulai ulang aplikasi simpul Anda.
```
node app.js
```

Membuat PR baru untuk menguji server status

Sekarang setelah server Anda berjalan dan mendengarkan pemberitahuan hook layanan, buat permintaan pull untuk mengujinya.

Mulai dalam tampilan file. Edit file readme.md di repositori Anda (atau file lain jika Anda tidak memiliki readme.md).
Edit dan terapkan perubahan pada repositori.
Pastikan untuk menerapkan perubahan ke cabang baru sehingga Anda dapat membuat PR di langkah berikutnya.
Pilih tautan Buat permintaan pull.
Tambahkan WIP dalam judul untuk menguji fungsionalitas aplikasi. Pilih Buat untuk membuat PR.
Setelah PR dibuat, Anda akan melihat bagian status, dengan entri Pekerjaan sedang berlangsung yang menautkan ke URL yang ditentukan dalam payload.
Perbarui judul PR dan hapus teks WIP dan perhatikan bahwa status berubah dari Pekerjaan sedang berlangsung menjadi Siap untuk ditinjau.

Langkah berikutnya

Dalam artikel ini, Anda mempelajari dasar-dasar cara membuat layanan yang mendengarkan peristiwa PR melalui kait layanan dan dapat memposting pesan status menggunakan API status. Untuk informasi selengkapnya tentang API status permintaan pull, lihat dokumentasi REST API.
Mengonfigurasi kebijakan cabang untuk layanan eksternal.

Bagikan melalui