Cap-go / capacitor-inappbrowser

Capacitor plugin in app browser with urlChangeEvent
MIT License
57 stars 37 forks source link
browser capacitor capacitor-plugin

@capgo/inappbrowser

Capgo - Instant updates for capacitor

Check out: Capgo — Instant updates for capacitor

Capacitor plugin in app browser with urlChangeEvent

Install

npm install @capgo/inappbrowser
npx cap sync

Usage

import { InAppBrowser } from '@capgo/inappbrowser'

InAppBrowser.open({ url: "YOUR_URL" });

Web platform is not supported. Use window.open instead.

Camera usage

if you need the Camera to work in Android, you need to add the following to your AndroidManifest.xml file:

<uses-permission android:name="android.permission.CAMERA" />

Then the permission will be asked when the camera is used.

API

* [`open(...)`](#open) * [`clearCookies(...)`](#clearcookies) * [`getCookies(...)`](#getcookies) * [`close()`](#close) * [`openWebView(...)`](#openwebview) * [`executeScript(...)`](#executescript) * [`setUrl(...)`](#seturl) * [`addListener('urlChangeEvent', ...)`](#addlistenerurlchangeevent-) * [`addListener('closeEvent', ...)`](#addlistenercloseevent-) * [`addListener('confirmBtnClicked', ...)`](#addlistenerconfirmbtnclicked-) * [`removeAllListeners()`](#removealllisteners) * [`reload()`](#reload) * [Interfaces](#interfaces) * [Type Aliases](#type-aliases) * [Enums](#enums) ### open(...) ```typescript open(options: OpenOptions) => Promise ``` Open url in a new window fullscreen | Param | Type | | ------------- | --------------------------------------------------- | | **`options`** | OpenOptions | **Returns:** Promise<any> **Since:** 0.1.0 -------------------- ### clearCookies(...) ```typescript clearCookies(options: ClearCookieOptions) => Promise ``` Clear cookies of url | Param | Type | | ------------- | ----------------------------------------------------------------- | | **`options`** | ClearCookieOptions | **Returns:** Promise<any> **Since:** 0.5.0 -------------------- ### getCookies(...) ```typescript getCookies(options: GetCookieOptions) => Promise> ``` Get cookies for a specific URL. | Param | Type | Description | | ------------- | ------------------------------------------------------------- | -------------------------------------------------- | | **`options`** | GetCookieOptions | The options, including the URL to get cookies for. | **Returns:** Promise<Record<string, string>> -------------------- ### close() ```typescript close() => Promise ``` **Returns:** Promise<any> -------------------- ### openWebView(...) ```typescript openWebView(options: OpenWebViewOptions) => Promise ``` Open url in a new webview with toolbars | Param | Type | | ------------- | ----------------------------------------------------------------- | | **`options`** | OpenWebViewOptions | **Returns:** Promise<any> **Since:** 0.1.0 -------------------- ### executeScript(...) ```typescript executeScript({ code }: { code: string; }) => Promise ``` Injects JavaScript code into the InAppBrowser window. | Param | Type | | --------- | ------------------------------ | | **`__0`** | { code: string; } | -------------------- ### setUrl(...) ```typescript setUrl(options: { url: string; }) => Promise ``` | Param | Type | | ------------- | ----------------------------- | | **`options`** | { url: string; } | **Returns:** Promise<any> -------------------- ### addListener('urlChangeEvent', ...) ```typescript addListener(eventName: "urlChangeEvent", listenerFunc: UrlChangeListener) => Promise ``` Listen for url change, only for openWebView | Param | Type | | ------------------ | --------------------------------------------------------------- | | **`eventName`** | 'urlChangeEvent' | | **`listenerFunc`** | UrlChangeListener | **Returns:** Promise<PluginListenerHandle> **Since:** 0.0.1 -------------------- ### addListener('closeEvent', ...) ```typescript addListener(eventName: "closeEvent", listenerFunc: UrlChangeListener) => Promise ``` Listen for close click only for openWebView | Param | Type | | ------------------ | --------------------------------------------------------------- | | **`eventName`** | 'closeEvent' | | **`listenerFunc`** | UrlChangeListener | **Returns:** Promise<PluginListenerHandle> **Since:** 0.4.0 -------------------- ### addListener('confirmBtnClicked', ...) ```typescript addListener(eventName: "confirmBtnClicked", listenerFunc: ConfirmBtnListener) => Promise ``` Will be triggered when user clicks on confirm button when disclaimer is required, works only on iOS | Param | Type | | ------------------ | ----------------------------------------------------------------- | | **`eventName`** | 'confirmBtnClicked' | | **`listenerFunc`** | ConfirmBtnListener | **Returns:** Promise<PluginListenerHandle> **Since:** 0.0.1 -------------------- ### removeAllListeners() ```typescript removeAllListeners() => Promise ``` Remove all listeners for this plugin. **Since:** 1.0.0 -------------------- ### reload() ```typescript reload() => Promise ``` Reload the current web page. **Returns:** Promise<any> **Since:** 1.0.0 -------------------- ### Interfaces #### OpenOptions | Prop | Type | Description | Since | | ---------------------------- | ------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | ----- | | **`url`** | string | Target URL to load. | 0.1.0 | | **`headers`** | Headers | Headers to send with the request. | 0.1.0 | | **`isPresentAfterPageLoad`** | boolean | if true, the browser will be presented after the page is loaded, if false, the browser will be presented immediately. | 0.1.0 | | **`preventDeeplink`** | boolean | | | #### Headers #### ClearCookieOptions | Prop | Type | | ----------- | -------------------- | | **`url`** | string | | **`cache`** | boolean | #### HttpCookie | Prop | Type | Description | | ----------- | ------------------- | ------------------------ | | **`url`** | string | The URL of the cookie. | | **`key`** | string | The key of the cookie. | | **`value`** | string | The value of the cookie. | #### GetCookieOptions | Prop | Type | | --------------------- | -------------------- | | **`url`** | string | | **`includeHttpOnly`** | boolean | #### OpenWebViewOptions | Prop | Type | Description | Default | Since | | -------------------------------------- | --------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------- | ------ | | **`url`** | string | Target URL to load. | | 0.1.0 | | **`headers`** | Headers | Headers to send with the request. | | 0.1.0 | | **`shareDisclaimer`** | DisclaimerOptions | share options | | 0.1.0 | | **`toolbarType`** | ToolBarType | Toolbar type | ToolBarType.DEFAULT | 0.1.0 | | **`shareSubject`** | string | Share subject | | 0.1.0 | | **`title`** | string | Title of the browser | 'New Window' | 0.1.0 | | **`backgroundColor`** | BackgroundColor | Background color of the browser, only on IOS | BackgroundColor.BLACK | 0.1.0 | | **`activeNativeNavigationForWebview`** | boolean | If true, active the native navigation within the webview, Android only | false | | | **`disableGoBackOnNativeApplication`** | boolean | Disable the possibility to go back on native application, usefull to force user to stay on the webview, Android only | false | | | **`isPresentAfterPageLoad`** | boolean | Open url in a new window fullscreen isPresentAfterPageLoad: if true, the browser will be presented after the page is loaded, if false, the browser will be presented immediately. | false | 0.1.0 | | **`isInspectable`** | boolean | Whether the website in the webview is inspectable or not, ios only | false | | | **`isAnimated`** | boolean | Whether the webview opening is animated or not, ios only | true | | | **`showReloadButton`** | boolean | Shows a reload button that reloads the web page | false | 1.0.15 | | **`closeModal`** | boolean | CloseModal: if true a confirm will be displayed when user clicks on close button, if false the browser will be closed immediately. | false | 1.1.0 | | **`closeModalTitle`** | string | CloseModalTitle: title of the confirm when user clicks on close button, only on IOS | 'Close' | 1.1.0 | | **`closeModalDescription`** | string | CloseModalDescription: description of the confirm when user clicks on close button, only on IOS | 'Are you sure you want to close this window?' | 1.1.0 | | **`closeModalOk`** | string | CloseModalOk: text of the confirm button when user clicks on close button, only on IOS | 'Close' | 1.1.0 | | **`closeModalCancel`** | string | CloseModalCancel: text of the cancel button when user clicks on close button, only on IOS | 'Cancel' | 1.1.0 | | **`visibleTitle`** | boolean | visibleTitle: if true the website title would be shown else shown empty | true | 1.2.5 | | **`toolbarColor`** | string | toolbarColor: color of the toolbar in hex format | '#ffffff'' | 1.2.5 | | **`showArrow`** | boolean | showArrow: if true an arrow would be shown instead of cross for closing the window | false | 1.2.5 | | **`ignoreUntrustedSSLError`** | boolean | ignoreUntrustedSSLError: if true, the webview will ignore untrusted SSL errors allowing the user to view the website. | false | 6.1.0 | #### DisclaimerOptions | Prop | Type | | ---------------- | ------------------- | | **`title`** | string | | **`message`** | string | | **`confirmBtn`** | string | | **`cancelBtn`** | string | #### PluginListenerHandle | Prop | Type | | ------------ | ----------------------------------------- | | **`remove`** | () => Promise<void> | #### UrlEvent | Prop | Type | Description | Since | | --------- | ------------------- | ------------------------- | ----- | | **`url`** | string | Emit when the url changes | 0.0.1 | #### BtnEvent | Prop | Type | Description | Since | | --------- | ------------------- | ------------------------------ | ----- | | **`url`** | string | Emit when a button is clicked. | 0.0.1 | ### Type Aliases #### ClearCookieOptions Omit<HttpCookie, 'key' | 'value'> #### Omit Construct a type with the properties of T except for those in type K. Pick<T, Exclude<keyof T, K>> #### Pick From T, pick a set of properties whose keys are in the union K { [P in K]: T[P]; } #### Exclude Exclude from T those types that are assignable to U T extends U ? never : T #### Record Construct a type with a set of properties K of type T { [P in K]: T; } #### GetCookieOptions Omit<HttpCookie, 'key' | 'value'> #### UrlChangeListener (state: UrlEvent): void #### ConfirmBtnListener (state: BtnEvent): void ### Enums #### ToolBarType | Members | Value | | ---------------- | ------------------------- | | **`ACTIVITY`** | "activity" | | **`NAVIGATION`** | "navigation" | | **`BLANK`** | "blank" | | **`DEFAULT`** | "" | #### BackgroundColor | Members | Value | | ----------- | -------------------- | | **`WHITE`** | "white" | | **`BLACK`** | "black" |

Credits