Mulai
Selamat datang di pengembangan Ekstensi Chrome. Temukan semua yang Anda perlukan untuk mulai mem-build dan mendistribusikan Ekstensi Chrome pertama Anda.
Ringkasan
Apa yang dimaksud dengan ekstensi?
Ekstensi Chrome meningkatkan pengalaman penjelajahan dengan menyesuaikan antarmuka pengguna, mengamati peristiwa browser, dan mengubah web. Kunjungi Chrome Web Store untuk melihat contoh lain tentang kemampuan ekstensi.
Bagaimana cara membuatnya?
Anda dapat mem-build ekstensi menggunakan teknologi web yang sama dengan yang digunakan untuk membuat aplikasi web: HTML, CSS, dan JavaScript.
Apa yang dapat mereka lakukan?
Selain Web API, ekstensi juga memiliki akses ke Chrome Extension API untuk menyelesaikan berbagai tugas. Untuk ringkasan yang lebih mendetail, lihat Panduan pengembangan.
Terminologi ekstensi
Ekstensi Chrome terdiri dari bagian-bagian yang memainkan peran yang berbeda.
Manifes
Manifes ekstensi adalah satu-satunya file yang diperlukan yang harus memiliki nama file tertentu: manifest.json. File ini juga harus berada di direktori root ekstensi. Manifes mencatat metadata penting, menentukan resource, mendeklarasikan izin, dan mengidentifikasi file yang akan dijalankan di latar belakang dan di halaman.
Pekerja layanan
Pekerja layanan berjalan di latar belakang dan menangani peristiwa browser, seperti menghapus bookmark, atau menutup tab. Fungsi ini tidak memiliki akses ke DOM, tetapi Anda dapat menggabungkannya dengan dokumen di balik layar untuk kasus penggunaan ini.
Skrip konten
Skrip konten menjalankan JavaScript dalam konteks halaman web.
Tindakan toolbar
Jalankan kode saat pengguna mengklik ikon toolbar ekstensi atau tampilkan pop-up menggunakan Action API.
Panel Samping
Menampilkan UI kustom di panel samping browser.
DeclarativeNetRequest
Mencegat, memblokir, atau mengubah permintaan jaringan.
Memublikasikan ke Chrome Web Store
Jika Anda membuat ekstensi untuk diri sendiri, lihat tutorial memulai. Jika ingin memublikasikan ke Chrome Web Store, ada beberapa hal yang perlu Anda ketahui terlebih dahulu.
Mendesain ekstensi berkualitas tinggi
Saat memilih fitur yang akan didukung, pastikan ekstensi Anda memenuhi satu tujuan yang didefinisikan secara sempit dan mudah dipahami.
Memahami kebijakan
Ekstensi yang didistribusikan di Chrome Web Store harus mematuhi kebijakan program developer. Pelajari kebijakan ini untuk memastikan ekstensi Anda dapat dihosting di Chrome Web Store.
Menyertakan semua logika ekstensi
Saat menulis kode, perhatikan bahwa semua logika harus disertakan dalam paket ekstensi. Artinya, tidak ada kode JavaScript tambahan yang dapat didownload saat runtime. Meningkatkan keamanan ekstensi menyediakan alternatif untuk menjalankan kode yang dihosting dari jarak jauh.
Tutorial
Pilih salah satu tutorial berikut untuk memulai perjalanan pembelajaran ekstensi Anda.
Ekstensi pertama Anda
Buat ekstensi hello world pertama Anda, tempat Anda akan memahami alur kerja pengembangan ekstensi.
Menjalankan skrip di setiap halaman
Pelajari cara menambahkan elemen secara otomatis ke situs yang ditentukan.
Memasukkan skrip ke tab aktif
Pelajari cara menyederhanakan gaya halaman saat ini dengan mengklik ikon toolbar.
Membuat pengelola tab
Pelajari cara membuat pop-up yang mengelola tab Anda.
Menangani peristiwa dengan pekerja layanan
Pelajari cara membuat dan men-debug pekerja layanan ekstensi.
Men-debug ekstensi
Pelajari cara menemukan log dan pesan error selama proses debug.