Mulai menggunakan Apache Cordova

Penting

Visual Studio App Center dijadwalkan untuk dihentikan pada 31 Maret 2025. Meskipun Anda dapat terus menggunakan Visual Studio App Center hingga sepenuhnya dihentikan, ada beberapa alternatif yang direkomendasikan yang dapat Anda pertimbangkan untuk bermigrasi.

Pelajari selengkapnya tentang garis waktu dukungan dan alternatif.

• Android
• iOS
• Ekstensi iOS
• React Native
• MAUI/Xamarin
• UWP
• WPF/WinForms
• Unity
• macOS
• Ekstensi macOS
• tvOS
• Cordova

Catatan

Dukungan untuk Aplikasi Cordova telah berakhir pada April 2022. Temukan informasi selengkapnya di blog App Center.

App Center SDK menggunakan arsitektur modular sehingga Anda dapat dengan mudah menggunakan satu, beberapa, atau semua layanan App Center di aplikasi Apache Cordova Anda.

Dalam artikel ini, Anda akan mempelajari cara menambahkan App Center SDK ke aplikasi Apache Cordova, lalu mengonfigurasi kemampuan App Center Analytics dan App Center Crash dalam aplikasi.

1. Prasyarat

Sebelum memulai, pastikan proyek aplikasi Apache Cordova Anda memenuhi persyaratan minimum berikut:

• Cordova CLI 6.4.0 atau yang lebih baru
• cordova-android engine 5.0.0 atau yang lebih baru
• cordova-ios engine 4.3.0 atau yang lebih baru

Untuk menentukan versi Cordova CLI Anda, buka jendela terminal atau prompt perintah Windows dan jalankan perintah berikut:

cordova -v

Untuk menentukan cordova-android versi dan cordova-ios , buka file config.xml proyek, Anda akan menemukan mesin platform yang ditentukan dalam elemen yang engine ditunjukkan di bawah ini:

<engine name="android" spec="~6.2.3" />
<engine name="ios" spec="~4.4.0" />

Anda juga harus menginstal CocoaPods . Untuk ini, jalankan sudo gem install cocoapodspod setup

2. Mendapatkan Rahasia Aplikasi App Center

Agar App Center SDK dapat terhubung dengan proyek aplikasi Anda di App Center, SDK memerlukan App Secret proyek App Center Anda. Anda akan mempelajari nanti cara mengonfigurasi App Center Apache Cordova SDK dengan nilai ini, tetapi untuk saat ini, mari kita lihat di mana menemukannya.

Jika Anda memiliki proyek aplikasi App Center yang sudah ada, akses Dasbor App Center, dan buka proyek Anda. Anda juga dapat rahasia aplikasi di halaman Pengaturan proyek aplikasi. Akses menu di sudut kanan atas halaman, lalu pilih Salin rahasia aplikasi untuk menyalin rahasia aplikasi ke clipboard.

Jika Anda tidak memiliki aplikasi yang dibuat di Dasbor App Center, selesaikan langkah-langkah berikut.

1. Daftar untuk akun App Center, atau Masuk ke akun App Center yang ada di https://appcenter.ms.
2. Di Dasbor App Center, klik menu drop-down Tambahkan baru di sudut kanan atas halaman. Pilih Tambahkan aplikasi baru dari menu.
3. Masukkan nama untuk proyek aplikasi Anda, menambahkan deskripsi opsional sesuai kebutuhan.
4. Pilih OS yang sesuai untuk proyek aplikasi Anda (hanya Android atau iOS), lalu pilih opsi platform Cordova .
5. Klik tombol Tambahkan aplikasi baru di sudut kanan bawah halaman.
6. Temukan rahasia aplikasi di halaman Pengaturan proyek aplikasi. Akses menu di sudut kanan atas halaman, lalu pilih item Salin rahasia aplikasi untuk menyalin rahasia aplikasi ke clipboard.

3. Tambahkan App Center SDK ke proyek

Menginstal SDK

Untuk proyek Apache Cordova, SDK didistribusikan melalui plugin Apache Cordova standar. Tambahkan App Center SDK ke proyek Cordova Anda menggunakan instruksi yang disediakan di bagian ini. Mulailah dengan membuka jendela Terminal atau prompt perintah Windows, lalu navigasikan ke folder akar proyek Cordova Anda.

Untuk menambahkan dukungan untuk App Center Analytics ke proyek Anda, jalankan perintah berikut:

cordova plugin add cordova-plugin-appcenter-analytics

Untuk menambahkan dukungan untuk App Center Crash ke proyek Anda, jalankan perintah berikut:

cordova plugin add cordova-plugin-appcenter-crashes

Untuk menambahkan plugin untuk semua kemampuan App Center ke proyek Anda dengan satu perintah, jalankan perintah berikut:

cordova plugin add cordova-plugin-appcenter-analytics cordova-plugin-appcenter-crashes

Catatan

Anda harus menambahkan cordova-plugin-appcenter-analytics dan cordova-plugin-appcenter-crash sebagian besar setiap aplikasi yang menggunakan App Center; mereka memberikan informasi yang berguna untuk pengembang tanpa penyiapan atau pengkodian tambahan.

Mengonfigurasi plugin

Rahasia Aplikasi

Anda harus mengonfigurasi proyek dengan rahasia aplikasi proyek App Center sebelum dapat menggunakan App Center SDK di proyek Apache Cordova Anda.

Buka file config.xml proyek Apache Cordova; untuk setiap elemen target platform proyek Apache Cordova Anda (hanya Android dan iOS hari ini), tambahkan elemen anak preference dalam format berikut:

<preference name="APP_SECRET" value="0000-0000-0000-0000-000000000000" />

Dalam contoh ini, Anda menambahkan elemen dengan name atribut dengan nilai APP_SECRET, dan value atribut dengan nilai yang ditunjukkan dalam contoh. Di sini, yang 0000-0000-0000-0000-000000000000 ditunjukkan dalam contoh adalah representasi arbitrer dari rahasia aplikasi proyek App Center. Ganti rahasia aplikasi yang ditampilkan dalam contoh dengan rahasia aplikasi aktual untuk proyek App Center Anda.

Sebagai contoh lengkap, untuk proyek Apache Cordova yang mendukung target Android dan iOS, Anda akan memiliki definisi proyek aplikasi terpisah di App Center, dan demikian, nilai rahasia aplikasi yang berbeda untuk setiap platform target. Bagian yang relevan dari file config.xml proyek akan terlihat seperti berikut ini:

<platform name="android">
   <preference name="APP_SECRET" value="0000-0000-0000-0000-000000000001" />
</platform>
<platform name="ios">
   <preference name="APP_SECRET" value="0000-0000-0000-0000-000000000002" />
</platform>

Catatan

Contohnya tidak menampilkan nilai rahasia aplikasi yang sebenarnya; ini hanyalah mock-up, Anda harus mengambil rahasia aplikasi proyek App Center Anda dan menggunakannya di sini. Rahasia aplikasi berbeda karena Anda akan memiliki rahasia unik untuk proyek aplikasi Android dan iOS di App Center.

Preferensi Analitik

Jika Anda menggunakan App Center Analytics di aplikasi, ada beberapa langkah konfigurasi tambahan yang harus dilakukan. Buka file config.xml proyek Apache Cordova di editor, dan tambahkan satu atau beberapa elemen berikut preferences ke file:

• APPCENTER_ANALYTICS_ENABLE_IN_JS - (opsional, defaultnya adalah false) Mengontrol apakah Analitik diaktifkan secara otomatis. Saat false, Analitik diaktifkan secara default. Saat true, aplikasi harus memanggil AppCenter.Analytics.setEnabled(true) (dalam kode JavaScript-nya) untuk mengaktifkan Analytics sebelum mengirim data ke App Center. Preferensi ini berguna ketika Anda ingin bertanya kepada pengguna apakah mereka ingin berbagi informasi analitik sebelum mengaktifkannya dalam aplikasi. Pelajari selengkapnya tentang mengirim peristiwa pengguna secara manual.

  Contoh:

  <preference name="APPCENTER_ANALYTICS_ENABLE_IN_JS" value="true" />
  

• APPCENTER_CRASHES_ALWAYS_SEND - (opsional, defaultnya adalah true) Menentukan apakah laporan crash secara otomatis dikirim ke App Center saat aplikasi crash. Saat mengirim laporan crash secara otomatis, setiap crash dilaporkan, berpotensi membuat tim teknik dan dukungan kewalahan. Saat mengirim laporan crash secara manual (mengatur APPCENTER_CRASHES_ALWAYS_SEND ke false), kode dalam aplikasi Anda dapat melakukan triase crash, dan memutuskan kapan laporan crash dikirim ke App Center, data apa yang disertakan dalam laporan, dan sebagainya. Ini berarti lebih banyak pekerjaan untuk pengembang, tetapi juga memberikan kontrol yang lebih besar atas privasi pengguna dan memungkinkan Anda melampirkan pesan dengan laporan crash. Pelajari selengkapnya tentang pemrosesan pada laporan crash di JS.

  Contoh:

  <preference name="APPCENTER_CRASHES_ALWAYS_SEND" value="false" />
  

  Jika Anda menggunakan pencadangan otomatis untuk menghindari mendapatkan informasi yang salah tentang perangkat, ikuti langkah-langkah berikutnya:

Catatan

Aplikasi yang menargetkan Android 6.0 (API level 23) atau yang lebih tinggi mengaktifkan Auto Backup secara otomatis. 

Catatan

Jika Anda sudah memiliki file kustom dengan aturan cadangan, beralihlah ke langkah ketiga.

a. Buat file appcenter_backup_rule.xml di folder res/xml .

<resource-file src="appcenter_backup_rule.xml" target="res/xml/appcenter_backup_rule.xml" />

b. Agar android:fullBackupContent atribut ditambahkan ke <application> elemen di dalam file AndroidManifest.xml , tambahkan baris berikut ke file config.xml aplikasi:

<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
     <application android:fullBackupContent="@xml/appcenter_backup_rule" />
</edit-config>
 ```

c. Add the following backup rules to the **appcenter_backup_rule.xml** file:

```xml
<full-backup-content xmlns:tools="http://schemas.android.com/tools">
   <exclude domain="sharedpref" path="AppCenter.xml"/>
   <exclude domain="database" path="com.microsoft.appcenter.persistence"/>
   <exclude domain="database" path="com.microsoft.appcenter.persistence-journal"/>
   <exclude domain="file" path="error" tools:ignore="FullBackupContent"/>
   <exclude domain="file" path="appcenter" tools:ignore="FullBackupContent"/>
</full-backup-content>

4. Ke mana selanjutnya?

Hebat, Anda sudah siap untuk memvisualisasikan data Analytics dan Crash yang dikumpulkan secara otomatis oleh SDK di portal. Tidak ada penyiapan tambahan yang diperlukan. Lihat bagian Analitik dan Crash untuk panduan dan panduan API untuk mempelajari apa yang dapat dilakukan App Center.