Vue d'ensemble
Section intitulée « Vue d'ensemble »@capgo/capacitor-inappbrowser fournit aux applications Capacitor deux chemins de navigateur : open() pour l'expérience de navigateur système et openWebView() pour un navigateur natif géré qui votre application peut dimensionner, masquer, envoyer des messages, scripter, configurer en tant que proxy et superposer avec l'UI d'Ionic.
Utilisez-le lorsque la page nécessite plus qu'un simple navigateur externe : les flux OAuth et de paiement, les portails de support intégrés, les écrans de paiement, les appels vidéo, les portails de documents, les applications web interactives ou tout flux où votre application nécessite des contrôles natifs autour du contenu web en direct.
Le nom du package a changé.Utilisations courantes
Sous-titre « Utilisations courantes »- Présentez l'interface utilisateur d'Ionic ou de Capacitor au-dessus d'une page de navigateur en direct avec
toBack,sendToBack(),bringToFront(),transparentBackground, etdispatchInputEvent(). - Construisez des navigateurs à écran partiel, des feuilles inférieures et des vues web en image sur image avec
width,height,x,y, etupdateDimensions(). - Permettez aux utilisateurs de cliquer sur l'application Capacitor en dehors d'une fenêtre de navigateur personnalisée sur Android et iOS.
- Exécutez les flux de paiement, de connexion, de support ou de changement de compte sans stockage persistant du site web en utilisant
persistWebViewData: false, etclearAllBrowsingData(). - Maintenez plusieurs instances de navigateur chargées avec
hidden,hide(), etshow()en préservant l'état de la page. - Intégrez des applications web avancées qui nécessitent la mise en cache de requêtes, les téléchargements de fichiers, les contrôles de popup, le support de Google Pay, la gestion des liens et les messages d'application vers page.
_blankCapacités de base
Sous-titre « Capacités de base »
- Ouvre une URL dans les onglets personnalisés de Chrome sur Android ouopen- Ouvre une vue native gérée avec une barre d'outils personnalisée, une taille personnalisée, une navigation native, des messages, des scripts, un proxy, des téléchargements, des popup et des contrôles de données.SFSafariViewController- Déplace une fenêtre de navigateur gérée derrière ou au-dessus de la __CAPGO_KEEP_0__ vue native hôte.openWebView- Transfère les événements de clic, de toucher et de défilement vers une fenêtre de navigateur qui se trouve derrière l'interface utilisateur native de l'application.sendToBack/bringToFront- Moves a managed browser behind or above the Capacitor host WebView.dispatchInputEvent- Transfère les événements de clic, de toucher et de défilement vers une fenêtre de navigateur qui se trouve derrière l'interface utilisateur native de l'application.updateDimensions- Modifie la taille et la position de la vue WebView gérée sans recharger la page.hide/show- Garde les vues Web gérées chargées tout en supprimant ou en restaurant leur présentation native.postMessage/executeScript- Connecte l'application Capacitor avec le JavaScript exécuté à l'intérieur de la page gérée.clearAllBrowsingData/persistWebViewData- Contrôle les cookies, la cache, le stockage, l'IndexedDB et la persistance de session.handleDownloads- Contrôle les règles de proxy, les événements de popup, les portails de documents, les flux d'upload, les pages de paiement et les applications web intégrées.
- Public API
- Section intitulée « Public API »| - Méthode | - Description |
|---|---|
goBack | - Retourne en arrière dans l'historique de la vue WebView si possible. |
open | - Ouvre l'URL dans une nouvelle fenêtre en plein écran, sur Android, elle utilise les onglets personnalisés de Chrome, sur iOS, elle utilise SFSafariViewController. |
clearCookies | - Efface les cookies de l'URL Lorsque id est omis, s'applique à toutes les fenêtres web ouvertes. |
clearAllCookies | Effacer tous les cookies Lorsque id est omis, s'applique à toutes les fenêtres web ouvertes. |
clearCache | Effacer le cache Lorsque id est omis, s'applique à toutes les fenêtres web ouvertes. |
clearAllBrowsingData | Efface les cookies, le cache, le stockage local, le stockage de session, IndexedDB et d'autres données de navigation du magasin par défaut et des WebViews gérés. |
getCookies | Récupérer les cookies pour une URL spécifique. |
close | Fermer la fenêtre web. Lorsque id est omis, ferme la fenêtre web active. |
hide | Cacher la fenêtre web sans la fermer. Utilisez show() pour la faire réapparaître. Lorsque id est omis, cible la fenêtre web active. |
show | Afficher une fenêtre web précédemment cachée. Lorsque id est omis, cible le webview actif. |
sendToBack | Déplace le navigateur natif derrière le Capacitor WebView hôte afin que l'interface utilisateur de l'application apparaisse au-dessus. |
bringToFront | Rétablit un navigateur qui se trouvait derrière le WebView hôte en premier plan. |
dispatchInputEvent | Envoie les événements de clic, de toucher ou de scroll vers un navigateur géré ; les coordonnées sont relatives à la vue de navigateur. |
openWebView | Ouvre l'URL dans un nouveau webview avec des barres d'outils et des capacités améliorées, comme l'accès à la caméra, l'accès aux fichiers, l'écoute d'événements, l'injection de JavaScript, la communication bidirectionnelle, etc. |
executeScript | Injecte le JavaScript code dans la fenêtre InAppBrowser. Lorsque id est omis, s'exécute dans tous les webviews ouverts. |
postMessage | Envoie un événement vers le webview (navigateur intégré). Écoutez dans la page avec window.addEventListener('messageFromNative', listenerFunc)Le detail payload doit être JSON-serializable. Lorsque id est omis, diffuse vers tous les webviews ouverts. |
takeScreenshot | Captures la vue actuelle du webview sous forme d'écran PNG. Lorsque id est omis, cible le webview actif. |
setUrl | Définit l'URL du webview. Lorsque id est omis, cible le webview actif. |
addListener | Ecoutez les changements d'URL, uniquement pour openWebView. |
addListener | Ecoutez les buttonNearDoneClick ; le payload contient le webview id. |
addListener | Ecoutez uniquement le clic de fermeture pour openWebView. |
addListener | Seront déclenchés lorsque l'utilisateur clique sur le bouton de confirmation lorsqu'un avertissement est requis, fonctionne avec openWebView shareDisclaimer et closeModal. |
addListener | Se déclenchera lorsque le webview envoie un événement vers l'application. Utilisez window.mobileApp.postMessage(...) dans la page, et gardez le payload JSON-serialisable. |
addListener | Seront déclenchés chaque fois qu'une capture d'écran est prise à partir du plugin API, le bouton de capture de l'application native ou le pont JavaScript injecté. |
addListener | Seront déclenchés lorsque la page est chargée. |
addListener | Sera déclenché lors d'une erreur de chargement de page. |
addListener | Sera déclenché après que le téléchargement natif a enregistré un fichier localement. Activez cela avec handleDownloads: true lors de l'ouverture de la vue web. |
addListener | Sera déclenché lors d'un échec du téléchargement natif. Activez cela avec handleDownloads: true lors de l'ouverture de la vue web. |
addListener | Sera déclenché chaque fois qu'une page ouvre une nouvelle fenêtre. Utilisez l'ID de la fenêtre popup retourné avec executeScript, postMessage, show, hide, et close. |
addListener | Ecoute les requêtes proxy déléguées par le runtime natif. Préférez addProxyHandler() au lieu d'appeler cela directement. |
addListener | Ecoute les messages de console JavaScript émis par la page gérée. Activez cela avec captureConsoleLogs: true lors de l'ouverture de la vue web. |
handleProxyRequest | Méthode interne utilisée par addProxyHandler() retourner une décision de proxy vers le natif. En avant la page d'origine. phase lors de la réponse à une demande manuelle. proxyRequest écouteur. |
removeAllListeners | Supprimer tous les écouteurs pour ce plugin. |
reload | Recharger la page web actuelle. |
updateDimensions | Mettre à jour les dimensions de la vue web. Permet de changer la taille et la position de la vue web en temps de exécution. Lorsque id est omis, cible la vue web active. |
setEnabledSafeTopMargin | Définit la marge de sécurité supérieure autorisée de la vue web en temps de exécution. Lorsque id est omis, cible la vue web active. Sur le Web, cette méthode est une opération sans effet et se résout sans modifier la disposition. |
setEnabledSafeBottomMargin | Définit la marge de sécurité inférieure autorisée de la vue web en temps de exécution. Lorsque id est omis, cible la vue web active. Sur le Web, cette méthode est une opération sans effet et se résout sans modifier la disposition. |
openSecureWindow | Ouvre une fenêtre OAuth2 sécurisée. Sur le Web, renvoie l'URL redirigée à travers un BroadcastChannel; sur mobile, enregistrez une URI de redirection personnalisée dans votre configuration d'application. Consultez le guide de démarrage rapide pour les exemples complets HTML, Info.plist et AndroidManifest. |
Valeurs de référence
Section intitulée « Valeurs de référence »Utilisez ces valeurs avec les options de la barre d'outils lors de l'ouverture d'un navigateur intégré ou d'une vue Web.
Types de barre d'outils
Section intitulée « Types de barre d'outils »| Valeur | L'utilisateur trouvera |
|---|---|
activity | Barre d'outils simple avec des contrôles de fermeture et de partage. |
compact | Barre d'outils simple avec un contrôle de fermeture. |
navigation | Barre d'outils de navigation complète avec des contrôles de retour en arrière et d'avance. |
blank | Aucune barre d'outils. |
Source Of Truth
Section intitulée “Source Of Truth”Cette référence est synchronisée à partir de src/definitions.ts en capacitor-inappbrowser.
Continuez à partir de @capgo/capacitor-inappbrowser
Section intitulée “Continuez à partir de @capgo/capacitor-inappbrowser”Si vous utilisez @capgo/capacitor-inappbrowser pour planifier le travail de plugin natif, connectez-l’à En utilisant @capgo/capacitor-inappbrowser pour la capacité native dans En utilisant @capgo/capacitor-inappbrowser, Répertoire du plugin Capgo pour le flux de travail du produit dans le Capgo Répertoire du plugin Capacitor Plugins par Capgo pour le détail d'implémentation dans Capacitor Plugins par Capgo Ajouter ou Mettre à Jour les Plugins pour le détail d'implémentation dans Ajouter ou Mettre à Jour les Plugins, et Alternatives de Plugins d'Entreprise Ionic pour le flux de travail du produit dans Alternatives de Plugins d'Entreprise Ionic.