@capgo/capacitor-browser dalam Aplikasi

Ringkasan

@capgo/capacitor-inappbrowser memberikan aplikasi Capacitor dua jalur browser: open() untuk pengalaman browser sistem dan openWebView() for a managed native WebView that your app can size, hide, message, script, proxy, and layer with Ionic UI.

Pakailah saat halaman memerlukan lebih dari browser eksternal sederhana: alur OAuth dan alur pembayaran, portal dukungan terintegrasi, layar pembayaran, panggilan video, portal dokumen interaktif, atau alur mana pun di mana aplikasi Anda memerlukan kontrol native di sekitar konten web yang hidup.

Paket nama berubah.

Penggunaan Umum

• Presentasikan antarmuka Ionic atau Capacitor di atas halaman browser yang aktif dengan toBack, sendToBack(), bringToFront(), transparentBackground, dan dispatchInputEvent().
• Bangun browser layar setengah, sheet bawah, dan tampilan web dalam gambar dengan width, height, x, y, dan updateDimensions().
• Biarkan pengguna mengetuk aplikasi Capacitor di luar kerangka browser ukuran kustom pada Android dan iOS.
• Jalankan alur pemesanan, login, dukungan, atau perubahan akun tanpa penyimpanan situs web yang berlangsung menggunakan persistWebViewData: false , dan clearAllBrowsingData().
• Simpan beberapa instance browser yang dimuat dengan hidden, hide()dan show() sambil menjaga keadaan halaman.
• Mengintegrasikan aplikasi web canggih yang memerlukan proxy permintaan, unggah file, unduh file, kontrol popup, dukungan Google Pay, _blank pengaturan link, dan pesan antara aplikasi dan halaman.

Kemampuan Dasar

• open - Membuka URL di Chrome Custom Tabs di Android atau SFSafariViewController - di iOS.
• openWebView - Membuka WebView native yang diatur dengan toolbar kustom, ukuran, navigasi native, pesan, skrip, proxy, unduh file, popup, dan kontrol data.
• sendToBack / bringToFront - Menggeser browser yang diatur ke belakang atau di atas WebView host Capacitor.
• dispatchInputEvent - Mengalihkan peristiwa klik, sentuh, dan geser ke browser yang berada di belakang UI aplikasi native.
• updateDimensions - Mengubah ukuran dan posisi WebView yang diatur tanpa memuat ulang halaman.
• hide / show - Memelihara WebViews yang diatur sambil menghapus atau mengembalikan presentasi aslinya.
• postMessage / executeScript - Menghubungkan aplikasi Capacitor dengan JavaScript yang berjalan di dalam halaman yang diatur.
• clearAllBrowsingData / persistWebViewData - Mengontrol cookie, cache, penyimpanan, IndexedDB, dan persistensi sesi.
• handleDownloads, aturan proxy, dan event popup - Mendukung portal dokumen, aliran unggah, halaman pembayaran, dan aplikasi web terintegrasi.

Publik API

Methode	Deskripsi
goBack	Mengembalikan navigasi ke sejarah WebView jika memungkinkan.
open	Membuka url di jendela baru fullscreen, di android menggunakan chrome custom tabs, di ios menggunakan SFSafariViewController.
clearCookies	Menghapus cookie url Ketika id Jika ditinggalkan, berlaku untuk semua webview yang terbuka.
clearAllCookies	Menghapus semua cookie Ketika id tidak ada penghapusan, berlaku untuk semua webview terbuka.
clearCache	Menghapus cache Ketika id tidak ada penghapusan, berlaku untuk semua webview terbuka.
clearAllBrowsingData	Menghapus cookie, cache, penyimpanan lokal, penyimpanan sesi, IndexedDB, dan data browsing lainnya dari penyimpanan default dan WebViews yang diatur.
getCookies	Mengambil cookie untuk URL tertentu.
close	Menghilangkan webview. Ketika id Menghilangkan webview aktif secara otomatis.
hide	Tutup sementara tampilan webview tanpa menutupnya. Gunakan show() untuk membawanya kembali. Ketika id Menghilangkan webview aktif secara otomatis.
show	Show a previously hidden webview. When id Menghilangkan webview aktif secara otomatis.
sendToBack	Menggerakkan browser asli di balik Capacitor host WebView sehingga UI aplikasi dapat muncul di atasnya.
bringToFront	Mengembalikan browser yang berada di balik host WebView ke depan.
dispatchInputEvent	Mengirimkan input klik, sentuh, atau gulir ke browser yang diatur; koordinat relatif terhadap viewport browser.
openWebView	Membuka URL di dalam webview baru dengan toolbar dan kemampuan yang ditingkatkan, seperti akses kamera, akses file, mendengarkan event, menginjeksi JavaScript, komunikasi dua arah, dll.
executeScript	Memasukkan JavaScript code ke dalam jendela InAppBrowser. Ketika id Ditampilkan, dieksekusi di semua webview yang terbuka.
postMessage	Mengirimkan event ke webview (browser dalam aplikasi). Dengarkan di halaman dengan window.addEventListener('messageFromNative', listenerFunc). The detail payload harus dapat di-serialisasi ke dalam JSON. Ketika id Jika tidak ada, siaran ke semua webview yang terbuka.
takeScreenshot	Menangkap viewport webview saat ini sebagai tangkapan layar PNG. Ketika id Jika tidak ada pengaturan, targetnya adalah webview aktif.
setUrl	Mengatur URL dari tampilan web. Ketika id terlewatkan, mengarah ke tampilan web aktif.
addListener	Mendengarkan perubahan URL, hanya untuk openWebView.
addListener	Mendengarkan buttonNearDoneClick; isi payload berisi tampilan web id.
addListener	Mendengarkan klik tutup hanya untuk openWebView.
addListener	Akan diaktifkan ketika pengguna mengklik tombol konfirmasi ketika peringatan diperlukan, bekerja dengan openWebView shareDisclaimer dan closeModal.
addListener	Mengeluarkan suara ketika tampilan web mengirimkan event kembali ke aplikasi. Gunakan window.mobileApp.postMessage(...) di halaman, dan jaga agar payload dapat di serialisasi ke JSON.
addListener	Akan diaktifkan setiap kali layar tangkapan sederhana diambil dari plugin API, tombol tangkapan layar native, atau jembatan JavaScript yang diinjeksikan.
addListener	Akan diaktifkan ketika halaman dimuat.
addListener	Akan diaktifkan ketika terjadi kesalahan memuat halaman.
addListener	Akan diaktifkan setelah penggunaan native download handling menyimpan file secara lokal. Aktifkan fitur ini dengan handleDownloads: true ketika membuka webview.
addListener	Akan diaktifkan ketika penggunaan native download handling gagal. Aktifkan fitur ini dengan handleDownloads: true ketika membuka webview.
addListener	Akan diaktifkan setiap kali halaman membuka popup/jendela baru. Gunakan id popup yang dikembalikan dengan executeScript, postMessage, show, hide, dan close.
addListener	Dengarkan permintaan proxy yang diwakilkan oleh runtime native. Lebih baik addProxyHandler() daripada memanggilnya secara langsung.
addListener	Dengarkan keluaran console JavaScript yang dihasilkan oleh halaman yang diatur. Aktifkan fitur ini dengan captureConsoleLogs: true ketika membuka webview.
handleProxyRequest	Metode internal yang digunakan oleh addProxyHandler() untuk mengirimkan keputusan proxy kembali ke native. Lakukan forward ke asal phase ketika menjawab balasan manual proxyRequest pengguna.
removeAllListeners	Hapus semua pengguna untuk plugin ini.
reload	Muat ulang halaman web saat ini.
updateDimensions	Ubah dimensi webview. Memungkinkan mengubah ukuran dan posisi webview pada waktu runtime. Ketika id ditinggalkan, mengarahkan ke webview aktif.
setEnabledSafeTopMargin	Mengatur margin atas yang aman diaktifkan webview pada waktu nyata. Ketika id ditinggalkan, mengarahkan ke webview aktif. Pada Web, metode ini adalah no-op dan menyelesaikan tanpa mengubah tata letak.
setEnabledSafeBottomMargin	Mengatur margin bawah yang aman diaktifkan webview pada waktu nyata. Ketika id ditinggalkan, mengarahkan ke webview aktif. Pada Web, metode ini adalah no-op dan menyelesaikan tanpa mengubah tata letak.
openSecureWindow	Membuka jendela OAuth2 yang aman. Pada web, kembali URL yang diarahkan melalui BroadcastChannelPada perangkat mobile, daftarkan URI pengalihan kustom di konfigurasi aplikasi Anda. Lihat panduan getting-started untuk contoh HTML, Info.plist, dan AndroidManifest yang lengkap.

Nilai Referensi

Pakai nilai-nilai ini bersamaan dengan opsi toolbar ketika membuka browser dalam aplikasi atau WebView.

Jenis Toolbar

Nilai	Pengguna akan menemukan
activity	Toolbar sederhana dengan kontrol tutup dan berbagi.
compact	Toolbar sederhana dengan kontrol tutup.
navigation	Toolbar navigasi lengkap dengan kontrol mundur dan maju.
blank	Tidak ada toolbar.

Sumber Kebenaran

Referensi ini disinkronkan dari src/definitions.ts di capacitor-inappbrowser.

Teruskan dari @capgo/capacitor-inappbrowser

Jika Anda menggunakan @capgo/capacitor-browser dalam Aplikasi untuk merencanakan pekerjaan plugin native, hubungkannya dengan Menggunakan @capgo/capacitor-inappbrowser untuk kemampuan native di Menggunakan @capgo/capacitor-inappbrowser, Capgo Direktori Plugin untuk alur produk di Direktori Plugin Capgo Capacitor Plugin oleh Capgo untuk detail implementasi di Capacitor Plugin oleh Capgo Menambahkan atau Mengupdate Plugin untuk detail implementasi di Menambahkan atau Mengupdate Plugin, dan Alternatif Plugin Enterprise Ionic untuk alur produk di Alternatif Plugin Enterprise Ionic.