@capgo/capacitor-in-app-Browser

Übersicht

@capgo/capacitor-inappbrowser gibt Capacitor-Apps zwei Browser-Pfade: open() für die Erfahrung des Systembrowsers und openWebView() für einen verwalteten nativen WebView, den Ihre App gruppieren, verbergen, Nachrichten senden, skripten, proxy und mit Ionic UI schichten kann.

Verwenden Sie es, wenn die Seite mehr als eine einfache externe Browseranwendung benötigt: OAuth- und Checkout-Flüsse, eingebaute Supportportale, Zahlungsanzeigen, Videounterhaltungen, Dokumentportale, interaktive Webanwendungen oder jede Fluss, bei der Ihre App native Steuerelemente um lebendige Webinhalte benötigt.

Der Paketname wurde geändert.

Häufige Verwendungsfälle

• Präsentieren Sie Ionic oder Capacitor-UI über einem lebenden Browser-Seitenelement mit toBack, sendToBack(), bringToFront(), transparentBackground, und dispatchInputEvent().
• Erstellen Sie Browseranwendungen mit teilweitem Bildschirm, unteren Blättern und Bild-in-Bild-Webansichten mit width, height, x, y, und updateDimensions().
• Lassen Sie Benutzer auf Capacitor außerhalb eines Browserrahmens mit einer benutzerdefinierten Größe auf Android und iOS klicken.
• Führen Sie Checkout-, Login-, Support- oder Konto-Wechsel-Flüsse ohne persistente Website-Speicherung mit persistWebViewData: false und clearAllBrowsingData().
• Mit mehreren Browserinstanzen laden, während die Seite erhalten bleibt. hidden, hide(), und show() während die Seite erhalten bleibt.
• Integriere fortschrittliche Webanwendungen, die eine Anforderungsproxying, Dateiuploads, Downloads, Popupsteuerung, Google Pay-Unterstützung, Linkverarbeitung und App-zu-Seiten-Meldungen benötigen. _blank Kernfunktionen

Abschnitt mit dem Titel “Kernfunktionen”

• open - Öffnet einen verwalteten nativen WebView mit einer benutzerdefinierten Toolbar, Größe, nativer Navigation, Messaging, Skriptierung, Proxy, Downloads, Popups und Datensteuerung. SFSafariViewController - Verschiebt einen verwalteten Browser hinter oder über den __CAPGO_KEEP_0__ Host-WebView.
• openWebView - Leitet Klick-, Touch- und Scrollereignisse an einen Browser weiter, der hinter der nativen App-UI liegt.
• sendToBack / bringToFront - Moves a managed browser behind or above the Capacitor host WebView.
• dispatchInputEvent Core Capabilities
• updateDimensions - Ändert die Größe und Position des verwalteten WebView ohne das Laden der Seite.
• hide / show - Halten Sie verwaltete WebViews geladen, während Sie sie entfernen oder ihre native Darstellung wiederherstellen.
• postMessage / executeScript - Verbindet die Capacitor-App mit JavaScript, das innerhalb des verwalteten Seitenbereichs ausgeführt wird.
• clearAllBrowsingData / persistWebViewData - Steuert Cookies, Cache, Speicher, IndexedDB und Sitzungs persistence.
• handleDownloads- Regeln für Proxy und Ereignisse von Pop-ups - Unterstützt Dokumentportale, Upload-Flüsse, Zahlungsseiten und eingebettete Webanwendungen.

- Öffnet API

- Methode	- Beschreibung
goBack	- Navigation zurück in der Historie des WebViews, wenn möglich.
open	- Öffnet die URL in einem neuen Fenster im Vollbildmodus, auf Android wird Chrome Custom Tabs verwendet, auf iOS wird SFSafariViewController verwendet.
clearCookies	- Löscht die Cookies der URL, wenn id wird übersprungen, gilt für alle geöffneten Webviews.
clearAllCookies	Alle Cookies löschen Wenn id wird übersprungen, gilt für alle geöffneten Webviews.
clearCache	Cache löschen Wenn id wird übersprungen, gilt für alle geöffneten Webviews.
clearAllBrowsingData	Cookies, Cache, lokale Speicherung, Sitzungs-Speicherung, IndexedDB und andere Browsing-Daten aus dem Standard- und verwalteten WebViews löschen.
getCookies	Holt Cookies für eine bestimmte URL.
close	Schließen Sie die Webview. Wenn id wird übersprungen, schließt die aktive Webview.
hide	Verstecken Sie die Webview ohne sie zu schließen. Verwenden Sie show() um sie wieder zu öffnen. Wenn id wird übersprungen, zielt auf die aktive Webview.
show	Zeigen Sie eine zuvor versteckte Webview an. Wenn id wird übersprungen, zielt auf das aktive WebView.
sendToBack	Verschiebt den native Browser hinter dem Capacitor Host-WebView, damit die App-UI über ihm erscheint.
bringToFront	Verschiebt einen Browser, der hinter dem Host-WebView stand, wieder nach vorne.
dispatchInputEvent	Übermittelt Klick-, Touch- oder Scroll-Eingaben an einen verwalteten Browser; die Koordinaten sind relativ zum Browser-Viewport.
openWebView	Öffnet eine URL in einem neuen WebView mit Werkzeugleisten und erweiterten Funktionen, wie Zugriff auf die Kamera, Dateizugriff, Ereignis-Abonnements, JavaScript-Injecting, bidirektionale Kommunikation usw.
executeScript	Fügt JavaScript code in das InAppBrowser-Fenster ein. Wenn id übersprungen wird, wird es in allen geöffneten WebViews ausgeführt.
postMessage	Sendet ein Ereignis an das WebView (In-App-Browser). Hören Sie im Seite mit window.addEventListener('messageFromNative', listenerFunc)auf. Der detail Muss JSON-seriellierbar sein. Wenn id übersprungen wird, wird es an alle geöffneten WebViews weitergeleitet.
takeScreenshot	Fängt das aktuelle WebView-Viewport als PNG-Bildschirmfoto ein. Wenn id wird übersprungen, zielt auf die aktive WebView.
setUrl	Setzt die URL der WebView. Wenn id wird übersprungen, zielt auf die aktive WebView.
addListener	Hört auf URL-Änderungen, nur für openWebView.
addListener	Hört auf buttonNearDoneClick ; der Payload enthält die WebView id.
addListener	Hört auf nur für close click bei openWebView.
addListener	Wird ausgelöst, wenn der Benutzer auf den Bestätigungsbutton klickt, wenn ein Hinweis erforderlich ist, funktioniert mit openWebView shareDisclaimer und closeModal.
addListener	Wird ausgelöst, wenn die WebView ein Ereignis an die App zurücksendet. Verwende window.mobileApp.postMessage(...) in der Seite, und halte den Payload JSON-seriellierbar.
addListener	Wird ausgelöst, wenn ein Screenshot vom Plugin API, der native Screenshot-Button oder die injizierte JavaScript-Brücke aufgenommen wird.
addListener	Wird ausgelöst, wenn die Seite geladen ist.
addListener	Wird ausgelöst, wenn eine Seitenbeladungsfehler auftritt.
addListener	Wird ausgelöst, nachdem die native Dateiübertragung eine Datei lokal gespeichert hat. Aktivieren Sie dies mit handleDownloads: true Wird ausgelöst, wenn eine Seite beim Öffnen der Webview geöffnet wird.
addListener	Wird ausgelöst, wenn die native Dateiübertragung fehlschlägt. Aktivieren Sie dies mit handleDownloads: true Wird ausgelöst, wenn eine Seite beim Öffnen der Webview geöffnet wird.
addListener	Wird ausgelöst, wenn eine Seite ein Popup/Neues Fenster öffnet. Verwenden Sie die zurückgegebene Popup-ID mit executeScript, postMessage, show, hideund close.
addListener	Hören Sie auf proxied Anfragen, die durch die native Runtime delegiert werden. Präferieren Sie addProxyHandler() anstatt dies direkt aufzurufen.
addListener	Hören Sie auf JavaScript-Konsolenausgaben, die durch die verwaltete Seite emittiert werden. Aktivieren Sie dies mit captureConsoleLogs: true wenn die Webview geöffnet wird.
handleProxyRequest	Methode, die intern von addProxyHandler() eine Proxyentscheidung an die native zurückzusenden. Fördern Sie das Original phase wenn man auf eine manuelle antwortet proxyRequest Hörer.
removeAllListeners	Entfernen Sie alle Hörer für dieses Plugin.
reload	Laden Sie die aktuelle Web-Seite neu.
updateDimensions	Aktualisieren Sie die Dimensionen des Web-Views. Es ermöglicht die Änderung der Größe und Position des Web-Views im Laufe der Zeit. Wenn id ist weggelassen, zielt es auf den aktiven Web-View.
setEnabledSafeTopMargin	Setzt die aktivierbare sichere obere Randmarke des Web-Views im Laufe der Zeit. Wenn id ist weggelassen, zielt es auf den aktiven Web-View. Auf Web ist diese Methode ein No-Op und löst ohne Änderung der Layout ohne Änderung.
setEnabledSafeBottomMargin	Setzt die aktivierbare sichere untere Randmarke des Web-Views im Laufe der Zeit. Wenn id ist weggelassen, zielt es auf den aktiven Web-View. Auf Web ist diese Methode ein No-Op und löst ohne Änderung der Layout ohne Änderung.
openSecureWindow	Öffnet eine sichere OAuth2-Fenster. Auf Web, gibt es die durchgeführte URL zurück durch ein BroadcastChannel; auf Mobilgeräten registrieren Sie eine benutzerdefinierte Umleitungs-URI in Ihrer Anwendungs-Konfiguration. Siehe die Anleitung zum Einrichten für die vollständige HTML, Info.plist und AndroidManifest-Beispiele.

Referenzwerte

Verwenden Sie diese Werte mit den Toolbar-Optionen, wenn Sie einen in-app-Browser oder WebView öffnen.

Toolbar-Typen

Wert	Der Benutzer findet
activity	Einfache Toolbar mit Schließen- und Teilen-Steuerungen.
compact	Einfache Toolbar mit einer Schließen-Steuerung.
navigation	Vollständige Navigationstoolbar mit Zurück- und Vorwärts-Steuerungen.
blank	Keine Toolbar.

Quelle der Wahrheit

Diese Referenz wird von src/definitions.ts in capacitor-inappbrowser.

Weitergehen von @capgo/capacitor-inappbrowser

Wenn Sie native Plugin-Arbeit planen, verbinden Sie es mit @capgo/capacitor-inappbrowser zur Verwendung von @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-inappbrowser für die native Fähigkeit in Using @capgo/capacitor-inappbrowser Wenn Sie native Plugin-Arbeit planen, verbinden Sie es mit @capgo/capacitor-inappbrowser Capgo Plugin-Verzeichnis für den Produktworkflow im Capgo Plugin-Verzeichnis Capacitor Plugins durch Capgo für die Implementierungsdetails in Capacitor Plugins durch Capgo Hinzufügen oder Aktualisieren von Plugins für die Implementierungsdetails in Hinzufügen oder Aktualisieren von Plugins, und Ionic Enterprise Plugin Alternativen für den Produktworkflow in Ionic Enterprise Plugin Alternativen.