Integrasi Azure DevOps

Integrasikan Capgo Live Updates dengan Azure DevOps Pipelines untuk memperbarui aplikasi Anda secara otomatis setiap kali Anda memasukkan code perubahan. Petunjuk ini mencakup pengaturan build otomatis, pengujian, dan alur kerja pengiriman.

Prasyarat

Sebelum mengatur integrasi Azure DevOps, pastikan Anda memiliki:

• Organisasi dan proyek Azure DevOps
• Akun Capgo dengan aplikasi yang dikonfigurasi
• Sumber code aplikasi Anda di repositori Git Azure Repos
• Node.js dan npm/yarn yang dikonfigurasi di proyek Anda

Konfigurasi Azure DevOps Pipeline

Langkah 1: Buat Variabel Pipeline

Pertama, buatlah variabel yang diperlukan di proyek Azure DevOps Anda:

1. Navigasikan ke proyek Azure DevOps Anda
2. Pergi ke Pipelines → Perpustakaan → Kelompok Variabel
3. Buat kelompok variabel baru bernama Capgo-Variables
4. Tambahkan variabel berikut:

Nama Variabel	Nilai	Amankan
CAPGO_TOKEN	Token Anda Capgo API	✅ Ya

Trik

Dapatkan token Anda Capgo API dari console.capgo.app/apikeys. ID aplikasi Anda sudah dikonfigurasi di file Anda. capacitor.config.ts Sederhana

Integrasi

Konfigurasi dasar yang mengirimkan ke produksi setiap kali push ke cabang utama:

# Simple Azure DevOps Pipeline for Capgo Live Updates
trigger:
  branches:
    include:
      - main

variables:
  - group: Capgo-Variables

jobs:
  - job: BuildAndDeploy
    displayName: 'Build and Deploy to Capgo'
    pool:
      vmImage: 'ubuntu-latest'

    steps:
      - task: NodeTool@0
        displayName: 'Setup Node.js'
        inputs:
          versionSpec: '22.x'

      - script: |
          npm ci
          npm run test
          npm run build
        displayName: 'Install, test and build'

      - script: |
          npm install -g @capgo/cli
          npx @capgo/cli bundle upload --apikey $(CAPGO_TOKEN) --channel production
        displayName: 'Deploy to Capgo'

Maju

Deploy Cabang Fitur

Deploy cabang fitur ke saluran uji untuk tinjauan dan pengujian:

# Feature branch deployment
trigger:
  branches:
    include:
      - feature/*

variables:
  - group: Capgo-Variables

jobs:
  - job: DeployFeature
    displayName: 'Deploy Feature Branch'
    pool:
      vmImage: 'ubuntu-latest'
    condition: startsWith(variables['Build.SourceBranch'], 'refs/heads/feature/')

    steps:
      - task: NodeTool@0
        inputs:
          versionSpec: '22.x'

      - script: |
          npm ci
          npm run test
          npm run build
        displayName: 'Install, test and build'

      - script: |
          BRANCH_NAME=$(echo "$(Build.SourceBranchName)" | sed 's/[^a-zA-Z0-9-]/-/g')
          CHANNEL_NAME="feature-$BRANCH_NAME"
          npm install -g @capgo/cli
          npx @capgo/cli channel create $CHANNEL_NAME --apikey $(CAPGO_TOKEN) || true
          npx @capgo/cli bundle upload --apikey $(CAPGO_TOKEN) --channel $CHANNEL_NAME
        displayName: 'Deploy to Feature Channel'

Trik

Pengujian dengan Saluran: Setelah menginstal ke dalam saluran fitur, Anda dapat menguji pembaruan di aplikasi Anda dengan mengkonfigurasi aplikasi untuk menggunakan saluran tersebut. Pelajari lebih lanjut tentang mengkonfigurasi saluran di aplikasi Anda.

Menggunakan Enkripsi

Jika Anda menggunakan fitur enkripsi Capgo, Anda perlu menyimpan kunci pribadi Anda dengan aman di lingkungan CI/CD Anda.

Setelah mengatur kunci enkripsi di lokal, tambahkan kunci pribadi Anda ke variabel Azure DevOps:

# Display your private key content (copy this output)
cat .capgo_key_v2

Tambahkan konten ini sebagai CAPGO_PRIVATE_KEY dalam grup variabel Azure DevOps Anda (tandai sebagai rahasia), kemudian gunakan di pipa:

# Deploy with encryption
- script: |
    npm install -g @capgo/cli
    npx @capgo/cli bundle upload --apikey $(CAPGO_TOKEN) --key-data-v2 "$(CAPGO_PRIVATE_KEY)" --channel production
  displayName: 'Deploy to Capgo with Encryption'

Peringatan

Praktik Keamanan Terbaik:

• Jangan pernah mengkomit file ke kontrol versi .capgo_key_v2 Simpan kunci pribadi hanya di manajemen rahasia CI/CD yang aman
• Gunakan kunci yang berbeda untuk lingkungan yang berbeda
• Konfigurasi Multi-Channel

Bagian berjudul “Konfigurasi Multi-Channel”

Untuk informasi yang lebih komprehensif tentang pengaturan dan pengelolaan beberapa saluran pengiriman, lihat Dokumentasi Saluran .

Pengaturan lengkap dengan beberapa lingkungan dan pengiriman permintaan pull:

# Advanced Azure DevOps Pipeline with Multiple Channels
trigger:
  branches:
    include:
      - main
      - develop

pr:
  branches:
    include:
      - main
      - develop

variables:
  - group: Capgo-Variables

stages:
  # Build stage
  - stage: Build
    jobs:
      - job: BuildApp
        pool:
          vmImage: 'ubuntu-latest'
        steps:
          - task: NodeTool@0
            inputs:
              versionSpec: '22.x'

          - script: |
              npm ci
              npm run test
              npm run build
            displayName: 'Install, test and build'

          - task: PublishBuildArtifacts@1
            inputs:
              pathToPublish: 'dist'
              artifactName: 'app-build'

  # Deploy to development
  - stage: DeployDev
    condition: and(succeeded(), eq(variables['Build.SourceBranch'], 'refs/heads/develop'))
    jobs:
      - deployment: DeployDevelopment
        environment: development
        pool:
          vmImage: 'ubuntu-latest'
        strategy:
          runOnce:
            deploy:
              steps:
                - task: NodeTool@0
                  inputs:
                    versionSpec: '22.x'

                - task: DownloadBuildArtifacts@0
                  inputs:
                    artifactName: 'app-build'
                    downloadPath: '$(Pipeline.Workspace)'

                - script: |
                    npm install -g @capgo/cli
                    npx @capgo/cli bundle upload --apikey $(CAPGO_TOKEN) --channel development --path $(Pipeline.Workspace)/app-build
                  displayName: 'Deploy to Development'

  # Deploy PR to test channel
  - stage: DeployPR
    condition: and(succeeded(), eq(variables['Build.Reason'], 'PullRequest'))
    jobs:
      - job: DeployPRChannel
        pool:
          vmImage: 'ubuntu-latest'
        steps:
          - task: NodeTool@0
            inputs:
              versionSpec: '22.x'

          - task: DownloadBuildArtifacts@0
            inputs:
              artifactName: 'app-build'
              downloadPath: '$(Pipeline.Workspace)'

          - script: |
              CHANNEL_NAME="pr-$(System.PullRequest.PullRequestNumber)"
              npm install -g @capgo/cli
              npx @capgo/cli channel create $CHANNEL_NAME --apikey $(CAPGO_TOKEN) || true
              npx @capgo/cli bundle upload --apikey $(CAPGO_TOKEN) --channel $CHANNEL_NAME --path $(Pipeline.Workspace)/app-build
            displayName: 'Deploy to PR Channel'

  # Deploy to production
  - stage: DeployProd
    condition: and(succeeded(), eq(variables['Build.SourceBranch'], 'refs/heads/main'))
    jobs:
      - deployment: DeployProduction
        environment: production
        pool:
          vmImage: 'ubuntu-latest'
        strategy:
          runOnce:
            deploy:
              steps:
                - task: NodeTool@0
                  inputs:
                    versionSpec: '22.x'

                - task: DownloadBuildArtifacts@0
                  inputs:
                    artifactName: 'app-build'
                    downloadPath: '$(Pipeline.Workspace)'

                - script: |
                    npm install -g @capgo/cli
                    npx @capgo/cli bundle upload --apikey $(CAPGO_TOKEN) --channel production --path $(Pipeline.Workspace)/app-build
                  displayName: 'Deploy to Production'

Pengiriman Multi-Lingkungan

Untuk skenario yang kompleks dengan beberapa lingkungan:

# Extended pipeline with multiple environments
parameters:
  - name: deployEnvironment
    displayName: 'Deploy Environment'
    type: string
    default: 'staging'
    values:
      - staging
      - production

variables:
  - group: Capgo-Variables
  - name: channelName
    ${{ if eq(parameters.deployEnvironment, 'production') }}:
      value: 'production'
    ${{ else }}:
      value: 'staging'

stages:
  # Build stage
  - stage: Build
    jobs:
      - job: BuildApp
        pool:
          vmImage: 'ubuntu-latest'
        steps:
          - task: NodeTool@0
            inputs:
              versionSpec: '22.x'

          - script: |
              npm ci
              npm run test
              npm run build
            displayName: 'Install, test and build'

          - task: PublishBuildArtifacts@1
            inputs:
              pathToPublish: 'dist'
              artifactName: 'app-build'

  - stage: DeployStaging
    displayName: 'Deploy to Staging'
    dependsOn: Build
    condition: and(succeeded(), eq('${{ parameters.deployEnvironment }}', 'staging'))
    jobs:
      - deployment: DeployStaging
        displayName: 'Deploy to Staging Channel'
        pool:
          vmImage: 'ubuntu-latest'
        environment: 'staging'
        strategy:
          runOnce:
            deploy:
              steps:
                - template: deploy-steps.yml
                  parameters:
                    channel: 'staging'

  - stage: DeployProduction
    displayName: 'Deploy to Production'
    dependsOn: Build
    condition: and(succeeded(), eq('${{ parameters.deployEnvironment }}', 'production'))
    jobs:
      - deployment: DeployProduction
        displayName: 'Deploy to Production Channel'
        pool:
          vmImage: 'ubuntu-latest'
        environment: 'production'
        strategy:
          runOnce:
            deploy:
              steps:
                - template: deploy-steps.yml
                  parameters:
                    channel: 'production'

Template Pengiriman (deploy-steps.yml)

Buat file template yang dapat digunakan kembali deploy-steps.yml:

deploy-steps.yml

parameters:
  - name: channel
    type: string

steps:
  - task: NodeTool@0
    displayName: 'Install Node.js'
    inputs:
      versionSpec: '22.x'

  - task: DownloadBuildArtifacts@0
    displayName: 'Download build artifacts'
    inputs:
      artifactName: 'app-build'
      downloadPath: '$(System.ArtifactsDirectory)'

  - script: |
      npm install -g @capgo/cli
    displayName: 'Install Capgo CLI'

  - script: |
      npx @capgo/cli bundle upload \
        --apikey $(CAPGO_TOKEN) \
        --channel ${{ parameters.channel }} \
        --path $(System.ArtifactsDirectory)/app-build
    displayName: 'Upload to Capgo (${{ parameters.channel }})'

Strategi Pengiriman Berdasarkan Cabang

Konfigurasi strategi pengiriman yang berbeda berdasarkan cabang Git:

trigger:
  branches:
    include:
      - main
      - develop
      - feature/*

variables:
  - group: Capgo-Variables
  - name: targetChannel
    ${{ if eq(variables['Build.SourceBranch'], 'refs/heads/main') }}:
      value: 'production'
    ${{ elseif eq(variables['Build.SourceBranch'], 'refs/heads/develop') }}:
      value: 'staging'
    ${{ else }}:
      value: 'development'

stages:
  - stage: Build
    jobs:
      - job: BuildApp
        pool:
          vmImage: 'ubuntu-latest'
        steps:
          - task: NodeTool@0
            inputs:
              versionSpec: '22.x'

          - script: |
              npm ci
              npm run test
              npm run build
            displayName: 'Install, test and build'

          - task: PublishBuildArtifacts@1
            inputs:
              pathToPublish: 'dist'
              artifactName: 'app-build'

  - stage: Deploy
    displayName: 'Deploy to $(targetChannel)'
    dependsOn: Build
    condition: succeeded()
    jobs:
      - deployment: DeployJob
        displayName: 'Deploy to $(targetChannel) Channel'
        pool:
          vmImage: 'ubuntu-latest'
        environment: '$(targetChannel)'
        strategy:
          runOnce:
            deploy:
              steps:
                - template: deploy-steps.yml
                  parameters:
                    channel: '$(targetChannel)'

Praktik Keamanan Terbaik

Pengelolaan Variabel yang Aman

1. Pakai Kelompok Variabel: Simpan data sensitif di kelompok variabel Azure DevOps
2. Mark as Rahasia: Selalu tandai token dan kunci API sebagai variabel rahasia
3. Akses Lingkup: Batasi akses grup variabel ke pipeline dan pengguna tertentu
4. Mengganti Kunci: Rotasikan kunci Capgo API secara teratur

Pengawasan dan Pemberitahuan

Integrasi Tim

Tambahkan pemberitahuan Microsoft Teams ke pipeline Anda:

- task: ms-teams-deploy-card@1.4.1
  displayName: 'Notify Teams on Success'
  condition: succeeded()
  inputs:
    webhookUri: '$(TEAMS_WEBHOOK_URL)'
    title: 'Capgo Deployment Successful'
    text: 'App deployed to $(targetChannel) channel'
    themeColor: '00FF00'

- task: ms-teams-deploy-card@1.4.1
  displayName: 'Notify Teams on Failure'
  condition: failed()
  inputs:
    webhookUri: '$(TEAMS_WEBHOOK_URL)'
    title: 'Capgo Deployment Failed'
    text: 'Deployment to $(targetChannel) failed'
    themeColor: 'FF0000'

Pemberitahuan Email

Konfigurasi pemberitahuan email untuk status pengembangan:

- task: EmailReport@1
  displayName: 'Send Email Report'
  condition: always()
  inputs:
    sendMailConditionConfig: 'Always'
    subject: 'Capgo Deployment Report - $(Build.BuildNumber)'
    to: 'team@yourcompany.com'
    body: |
      Deployment Status: $(Agent.JobStatus)
      Channel: $(targetChannel)
      Build: $(Build.BuildNumber)
      Commit: $(Build.SourceVersion)

Pengaturan

Judul Bagian “Pengaturan”

Pipeline fails with “Capgo CLI not found”:

# Ensure global installation
- script: |
    npm install -g @capgo/cli
    which capgo || echo "Capgo CLI not found in PATH"
  displayName: 'Install and verify Capgo CLI'

Salin ke clipboard

# Verify token is correctly set
- script: |
    echo "Token length: ${#CAPGO_TOKEN}"
    if [ -z "$CAPGO_TOKEN" ]; then
      echo "CAPGO_TOKEN is not set"
      exit 1
    fi
  displayName: 'Verify Capgo token'
  env:
    CAPGO_TOKEN: $(CAPGO_TOKEN)

Salin ke clipboard

# List available artifacts for debugging
- script: |
    ls -la $(System.ArtifactsDirectory)
    find $(System.ArtifactsDirectory) -name "*.js" -o -name "*.html"
  displayName: 'Debug artifacts'

Debug Pipeline

Tambahkan langkah debugging untuk menyelesaikan masalah:

- script: |
    echo "Build.SourceBranch: $(Build.SourceBranch)"
    echo "Build.BuildNumber: $(Build.BuildNumber)"
    echo "Target Channel: $(targetChannel)"
  displayName: 'Debug Pipeline Variables'

- script: |
    npx @capgo/cli app debug --apikey $(CAPGO_TOKEN)
  displayName: 'Debug Capgo App Status'

Langkah Selanjutnya

• Bagian berjudul “Langkah Selanjutnya” Belajar tentang Saluran
• Konteks: Fitur saluran rilis Capgo. Halaman/area: Halaman pemasaran solusi Capgo. Peran: Label UI singkat atau item navigasi. Dilihat di: halaman solusi/white-label.astro. Pesan kunci `solutions_white_label_visual_cell2_value` (Nilai Sel Tampilan Putih Label Solusi). untuk mengelola lingkungan pengembangan yang berbeda-beda untuk skenario pengembangan lanjutan
• Konfigurasi Enkripsi untuk penggunaan yang lebih aman
• Konfigurasi Perilaku Pembaruan untuk mengatur bagaimana pembaruan diterapkan

Dengan integrasi Azure DevOps, Anda dapat mengotomatisasi Capgo Anda dan memastikan pembaruan yang konsisten dan dapat diandalkan untuk pengguna aplikasi seluler Anda.

Teruskan dari Integrasi Azure DevOps

Jika Anda menggunakan Integrasi Azure DevOps untuk merencanakan otomatisasi CI/CD, hubungkannya dengan Capgo Otomatisasi CI/CD untuk alur kerja produk di Capgo Otomatisasi CI/CD, Capgo Pembangunan Nativ untuk alur kerja produk di Capgo Pembangunan Nativ, Capgo Integrasi for the product workflow in Capgo Integrations, untuk alur kerja produk di __CAPGO_KEEP_0__ Integrasi, Integrasi CI/CD GitHub Actions Integration for the implementation detail in GitHub Actions Integration.