跳过内容

@capgo/capacitor-inappbrowser

Capacitor的本机内嵌浏览器,具有管理的WebViews、本机UI层次、私有会话、代理、下载、弹出窗口和应用消息。

@capgo/capacitor-inappbrowser 为 Capacitor 应用提供两个浏览器路径: open() 用于系统浏览器体验和 openWebView() 用于管理的本机 WebView,应用可以调整大小、隐藏、发送消息、脚本、代理和层化 Ionic UI。

在页面需要更复杂的外部浏览器时使用:OAuth 和结帐流程、嵌入式支持门户、付款屏幕、视频呼叫、文档门户、交互式 Web 应用或任何流程,其中应用需要本机控制器围绕实时 Web 内容。

包名已更改。

常见用例

常见用例
  • 在一个实时浏览器页面上呈现Ionic或Capacitor UI toBack, sendToBack(), bringToFront(), transparentBackgrounddispatchInputEvent().
  • 使用__CAPGO_KEEP_0__构建部分屏幕浏览器、底部弹出窗口和图片在图片浏览器视图 width, height, x, yupdateDimensions().
  • 在Android和iOS上让用户在一个自定义大小的浏览器框架外点击Capacitor应用
  • 在没有持久性网站存储的情况下使用__CAPGO_KEEP_0__运行结帐、登录、支持或账户切换流程 persistWebViewData: falseclearAllBrowsingData().
  • 使用__CAPGO_KEEP_0__保持多个浏览器实例加载 hidden, hide()show() 在保持页面状态的情况下。
  • 嵌入需要请求代理、文件上传、下载、弹出控制、Google Pay 支持、链接处理和应用到页面消息的高级 Web 应用。 _blank 核心功能
  • open - 在自定义工具栏、大小、原生导航、消息、脚本、代理、下载、弹出窗口和数据控制的管理原生 WebView 中打开 URL。 SFSafariViewController - 将管理的浏览器放在或在 __CAPGO_KEEP_0__ 主机 WebView 之后的后台。
  • openWebView - 将点击、触摸和滚动事件转发到后台的原生应用 UI 后面的浏览器。
  • sendToBack / bringToFront - Moves a managed browser behind or above the Capacitor host WebView.
  • dispatchInputEvent - 在移除或恢复原生呈现时保留管理的 WebViews 加载状态。
  • updateDimensions Core Capabilities
  • hide / show Section titled “Core Capabilities”
  • postMessage / executeScript - 将 Capacitor 应用程序连接到 JavaScript 运行在管理页面内。
  • clearAllBrowsingData / persistWebViewData - 控制 cookie、缓存、存储、 IndexedDB 和会话持久性 - 支持文档门户、上传流程、付款页面和嵌入式 Web 应用程序。
  • handleDownloads公共 __CAPGO_KEEP_0__
描述如果可能,浏览器的历史记录中回退。
goBack在全屏幕中打开 URL,在 Android 上使用 Chrome 自定义标签,在 iOS 上使用 SFSafariViewController。
open清除 URL 的 cookie 当
clearCookies不填写时,适用于所有打开的 Webview。 id 清除所有 cookie 当
clearAllCookies__CAPGO_KEEP_0__ id 适用于所有打开的网页视图.
clearCache清除缓存 When id 适用于所有打开的网页视图.
clearAllBrowsingData清除 cookies、缓存、localStorage、sessionStorage、IndexedDB 和其他浏览器数据从默认存储和管理的 WebView.
getCookies获取某个 URL 的 cookies.
close关闭网页视图。 When id 适用于关闭当前网页视图.
hide隐藏网页视图而不关闭它。使用 show() 可以将其恢复。 When id 适用于当前网页视图.
show显示之前隐藏的网页视图。 When id 适用于当前网页视图.
sendToBack将本机浏览器推到 Capacitor 主机 WebView 后面,以便应用 UI 可以出现在它的上面.
bringToFront将浏览器从宿主 WebView 后面移到前面。
dispatchInputEvent将点击、触摸或滚动输入分发到管理的浏览器; 坐标相对于浏览器视图。
openWebView在带有工具栏和增强功能(如摄像头访问、文件访问、监听事件、注入 JavaScript、双向通信等)的新 webview 中打开 URL。
executeScript将 JavaScript code 注入 InAppBrowser 窗口中。当 id 省略时,在所有打开的 webview 中执行。
postMessage向 webview (内嵌浏览器) 发送事件。 在页面中使用 window.addEventListener('messageFromNative', listenerFunc)。 事件载荷必须是 JSON 可序列化的。当 detail 省略时,广播到所有打开的 webview 中。 id 捕获当前 webview 视图作为 PNG 截图。当
takeScreenshot省略时,目标是活动的 webview。 id 设置 webview 的 URL。当
setUrl省略时,影响所有打开的 webview。 id 被省略,目标是激活的webview。
addListener仅监听url变化,用于openWebView。
addListener仅监听 buttonNearDoneClick;载荷包含webview id.
addListener仅监听关闭点击,用于openWebView。
addListener当用户点击确认按钮时,需要显示免责声明,适用于openWebView shareDisclaimer和closeModal。
addListener当webview向应用发送事件时触发。使用 window.mobileApp.postMessage(...) 在页面中,保持载荷为JSON序列化。
addListener当插件API、原生截图按钮或注入的JavaScript桥梁捕获截图时触发。
addListener当页面加载时触发。
addListener当页面加载错误时触发。
addListener当本地文件保存后触发本地下载处理。启用此功能 handleDownloads: true 当打开webview时。
addListener当原生下载处理失败时触发。使用 handleDownloads: true 当打开webview时。
addListener每当页面打开弹窗/新窗口时触发。使用返回的弹窗ID与 executeScript, postMessage, show, hide, 和 close.
addListener监听原生运行时代理的请求。优先 addProxyHandler() 而不是直接调用。
addListener监听由管理页面发出的JavaScript控制台输出。使用 captureConsoleLogs: true 当打开webview时。
handleProxyRequest内部方法由 addProxyHandler() 向原生发送代理决策。转发原始 phase 当回复手动请求时 proxyRequest __CAPGO_KEEP_0__
removeAllListeners移除此插件的所有监听器。
reload重新加载当前网页。
updateDimensions更新 webview 的尺寸。允许在运行时更改 webview 的大小和位置。当 id 省略时,目标是活动的 webview。
setEnabledSafeTopMargin设置 webview 在运行时的启用安全顶部边距。当 id 省略时,目标是活动的 webview。On Web,这个方法是无效的,并且不会改变布局。
setEnabledSafeBottomMargin设置 webview 在运行时的启用安全底部边距。当 id 省略时,目标是活动的 webview。On Web,这个方法是无效的,并且不会改变布局。
openSecureWindow在安全的 OAuth2 窗口中打开。On web,通过 BroadcastChannel;在移动设备上,注册一个自定义重定向 URI 在您的应用配置中。见获取启动指南中的完整 HTML、Info.plist 和 AndroidManifest 示例。

参考值

参考值

在打开内置浏览器或WebView时,使用这些值与工具栏选项。

工具栏类型

工具栏类型
用户将找到
activity带有关闭和分享控件的简单工具栏。
compact带有关闭控件的简单工具栏。
navigation带有后退和前进控件的全功能导航工具栏。
blank无工具栏。

真实来源

真实来源

本参考文档是同步从 src/definitions.tscapacitor-inappbrowser.

从 @capgo/capacitor-inappbrowser 中继续

标题:从 @capgo/capacitor-inappbrowser 中继续

如果您正在使用 @capgo/capacitor-inappbrowser 来规划原生插件工作,连接它到 使用 @capgo/capacitor-inappbrowser 来实现原生能力的 Using @capgo/capacitor-inappbrowser Capgo 插件目录 在 Capgo 插件目录 中的产品工作流程, Capacitor 插件由 Capgo 提供 在 Capacitor 插件由 Capgo 提供中了解实现细节 添加或更新插件 在添加或更新插件中了解实现细节, 和 Ionic 企业插件替代品 了解 Ionic 企业插件替代品中的产品工作流程