{"id":4642,"url":"https://github.com/proyecto26/react-native-inappbrowser","last_synced_at":"2025-05-13T16:11:35.035Z","repository":{"id":38848882,"uuid":"147781722","full_name":"proyecto26/react-native-inappbrowser","owner":"proyecto26","description":"📱InAppBrowser for React Native (Android \u0026 iOS) 🤘","archived":false,"fork":false,"pushed_at":"2024-10-27T16:02:37.000Z","size":2815,"stargazers_count":1359,"open_issues_count":88,"forks_count":233,"subscribers_count":11,"default_branch":"develop","last_synced_at":"2025-04-23T23:04:49.542Z","etag":null,"topics":["android","browser","chrome","chrome-custom-tabs","chrome-customtabs","deep-linking","deep-links","inappbrowser","ios","oauth","oauth2","react-native","react-native-library","react-native-plugin","safari","safari-services","sso-authentication","sso-login","xcode"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/react-native-inappbrowser-reborn","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/proyecto26.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":"jdnichollsc","patreon":"proyecto26","open_collective":"proyecto26","ko_fi":"proyecto26","liberapay":"proyecto26","donorbox":"proyecto-26","custom":["paypal.me/jdnichollsc","buymeacoffee.com/jdnichollsc","donorbox.org/proyecto-26"]}},"created_at":"2018-09-07T06:39:07.000Z","updated_at":"2025-04-21T11:15:33.000Z","dependencies_parsed_at":"2023-12-19T03:04:02.949Z","dependency_job_id":"60e0bae1-9053-41bb-97f0-8c2e2564511f","html_url":"https://github.com/proyecto26/react-native-inappbrowser","commit_stats":{"total_commits":321,"total_committers":53,"mean_commits":6.056603773584905,"dds":"0.33956386292834895","last_synced_commit":"17b4edbf0c3ec5c13d0455c62d262bcd67afd3e5"},"previous_names":[],"tags_count":22,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/proyecto26%2Freact-native-inappbrowser","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/proyecto26%2Freact-native-inappbrowser/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/proyecto26%2Freact-native-inappbrowser/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/proyecto26%2Freact-native-inappbrowser/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/proyecto26","download_url":"https://codeload.github.com/proyecto26/react-native-inappbrowser/tar.gz/refs/heads/develop","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250528732,"owners_count":21445516,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","browser","chrome","chrome-custom-tabs","chrome-customtabs","deep-linking","deep-links","inappbrowser","ios","oauth","oauth2","react-native","react-native-library","react-native-plugin","safari","safari-services","sso-authentication","sso-login","xcode"],"created_at":"2024-01-05T20:17:18.805Z","updated_at":"2025-04-23T23:04:57.789Z","avatar_url":"https://github.com/proyecto26.png","language":"Java","funding_links":["https://github.com/sponsors/jdnichollsc","https://patreon.com/proyecto26","https://opencollective.com/proyecto26","https://ko-fi.com/proyecto26","https://liberapay.com/proyecto26","proyecto-26","paypal.me/jdnichollsc","buymeacoffee.com/jdnichollsc","donorbox.org/proyecto-26","https://tidelift.com/subscription/pkg/npm-react-native-inappbrowser-reborn?utm_source=npm-react-native-inappbrowser-reborn\u0026utm_medium=referral\u0026utm_campaign=readme","https://tidelift.com/badges/package/npm/react-native-inappbrowser-reborn","https://opencollective.com/proyecto26/contribute","https://opencollective.com/proyecto26/organization/0/website","https://opencollective.com/proyecto26/organization/1/website","https://opencollective.com/proyecto26/organization/2/website","https://opencollective.com/proyecto26/organization/3/website","https://opencollective.com/proyecto26/organization/4/website","https://opencollective.com/proyecto26/organization/5/website","https://opencollective.com/proyecto26/organization/6/website","https://opencollective.com/proyecto26/organization/7/website","https://opencollective.com/proyecto26/organization/8/website","https://opencollective.com/proyecto26/organization/9/website","http://www.paypal.me/jdnichollsc/2","https://tidelift.com/subscription/pkg/npm-react-native-inappbrowser-reborn?utm_source=npm-react-native-inappbrowser-reborn\u0026utm_medium=referral\u0026utm_campaign=enterprise\u0026utm_term=repo","https://tidelift.com/security"],"categories":["Components","Java"],"sub_categories":["Web"],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"./LICENSE\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/license-MIT-blue.svg\" alt=\"MIT license\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://npmjs.org/package/react-native-inappbrowser-reborn\"\u003e\n    \u003cimg src=\"http://img.shields.io/npm/v/react-native-inappbrowser-reborn.svg\" alt=\"Current npm package version\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://github.com/proyecto26/react-native-inappbrowser/graphs/commit-activity\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/Maintained%3F-yes-brightgreen.svg\" alt=\"Maintenance\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://tidelift.com/subscription/pkg/npm-react-native-inappbrowser-reborn?utm_source=npm-react-native-inappbrowser-reborn\u0026utm_medium=referral\u0026utm_campaign=readme\"\u003e\n    \u003cimg src=\"https://tidelift.com/badges/package/npm/react-native-inappbrowser-reborn\" alt=\"Tidelift Subscription\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://opencollective.com/proyecto26\" alt=\"Financial Contributors on Open Collective\"\u003e\n    \u003cimg src=\"https://opencollective.com/proyecto26/all/badge.svg?label=financial+contributors\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://npmjs.org/package/react-native-inappbrowser-reborn\"\u003e\n    \u003cimg src=\"http://img.shields.io/npm/dm/react-native-inappbrowser-reborn.svg\" alt=\"Downloads\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://npmjs.org/package/react-native-inappbrowser-reborn\"\u003e\n    \u003cimg src=\"http://img.shields.io/npm/dt/react-native-inappbrowser-reborn.svg?label=total%20downloads\" alt=\"Total downloads\" /\u003e\n  \u003c/a\u003e\n  \u003ca href=\"https://twitter.com/intent/follow?screen_name=jdnichollsc\"\u003e\n    \u003cimg src=\"https://img.shields.io/twitter/follow/jdnichollsc.svg?label=Follow%20@jdnichollsc\" alt=\"Follow @jdnichollsc\" /\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch1 align=\"center\"\u003eInAppBrowser for React Native\u003c/h1\u003e\n\u003ch3 align=\"center\"\u003eProvides access to the system's web browser and supports handling redirects\u003c/h3\u003e\n\u003ch4 align=\"center\"\u003e\u003ca href=\"https://developer.chrome.com/multidevice/android/customtabs#whatarethey\"\u003eChrome Custom Tabs\u003c/a\u003e for Android \u0026 \u003ca href=\"https://developer.apple.com/documentation/safariservices\"\u003eSafariServices\u003c/a\u003e/\u003ca href=\"https://developer.apple.com/documentation/authenticationservices\"\u003eAuthenticationServices\u003c/a\u003e for iOS.\u003c/h4\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"400px\" src=\"https://github.com/proyecto26/react-native-inappbrowser/blob/main/img/inappbrowser.png?raw=true\"\u003e\n\u003c/p\u003e\n\n## Who is using InAppBrowser?\n\nDo you want to see this package in action? Check these awesome projects, yay! 🎉\n- [MyApp](https://github.com/proyecto26/MyApp) - A template to create awesome Apps easily ⚡️\n- [OLIO](https://olioex.com) - Share more. Waste less.\n- [Alpe Audio](https://www.alpeaudio.com) - Courses On The Go.\n- [VibePay](https://vibepay.com) - A simple, smarter, better way to get paid.\n- [Opinio](https://opinio.media) - Allows the population to be surveyed on social issues.\n- [medpex: Online Apotheke](https://www.medpex.de) - Online pharmacy for medicines \u0026 cosmetics with over 5 million customers.\n- [CONTACT Software](https://www.contact-software.com/) - Energizing your digital business.\n\nShare your awesome project [here](https://github.com/proyecto26/react-native-inappbrowser/issues/164)! ❤️\n\n## Getting started\n\n`$ npm install react-native-inappbrowser-reborn --save`\n\n### Mostly automatic installation\n\n#### Using React Native \u003e= 0.60\nLinking the package manually is not required anymore with [Autolinking](https://github.com/react-native-community/cli/blob/master/docs/autolinking.md).\n\n- **iOS Platform:**\n\n  `$ cd ios \u0026\u0026 pod install \u0026\u0026 cd ..` # CocoaPods on iOS needs this extra step\n\n- **Android Platform with Android Support:**\n\n  Using [Jetifier tool](https://github.com/mikehardy/jetifier) for backward-compatibility.\n\n  Modify your **android/build.gradle** configuration:\n  ```\n  buildscript {\n    ext {\n      buildToolsVersion = \"28.0.3\"\n      minSdkVersion = 16\n      compileSdkVersion = 28\n      targetSdkVersion = 28\n      // Only using Android Support libraries\n      supportLibVersion = \"28.0.0\"\n    }\n  ```\n\n- **Android Platform with AndroidX:**\n\n  Modify your **android/build.gradle** configuration:\n  ```\n  buildscript {\n    ext {\n      buildToolsVersion = \"30.0.2\"\n      minSdkVersion = 21\n      compileSdkVersion = 30\n      targetSdkVersion = 30\n      ndkVersion = \"21.4.7075529\"\n      // Remove 'supportLibVersion' property and put specific versions for AndroidX libraries\n      androidXAnnotation = \"1.2.0\"\n      androidXBrowser = \"1.3.0\"\n      // Put here other AndroidX dependencies\n    }\n  ```\n\n#### Using React Native \u003c 0.60\n\n`$ react-native link react-native-inappbrowser-reborn`\n\n### Manual installation\n\n#### iOS\n\n1. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]`\n2. Go to `node_modules` ➜ `react-native-inappbrowser-reborn` and add `RNInAppBrowser.xcodeproj`\n3. In XCode, in the project navigator, select your project. Add `libRNInAppBrowser.a` to your project's `Build Phases` ➜ `Link Binary With Libraries`\n4. Run your project (`Cmd+R`)\u003c\n\n#### iOS with Podfile\n1. Open up `ios/Podfile`\n  - Add `pod 'RNInAppBrowser', :path =\u003e '../node_modules/react-native-inappbrowser-reborn'`\n2. Run `pod install`\n\n#### Android\n\n1. Open up `android/app/src/main/java/[...]/MainApplication.java`\n  - Add `import com.proyecto26.inappbrowser.RNInAppBrowserPackage;` to the imports at the top of the file\n  - Add `new RNInAppBrowserPackage()` to the list returned by the `getPackages()` method\n2. Append the following lines to `android/settings.gradle`:\n  \t```\n  \tinclude ':react-native-inappbrowser-reborn'\n  \tproject(':react-native-inappbrowser-reborn').projectDir = new File(rootProject.projectDir, \t'../node_modules/react-native-inappbrowser-reborn/android')\n  \t```\n3. Insert the following lines inside the dependencies block in `android/app/build.gradle`:\n  \t```\n      implementation project(':react-native-inappbrowser-reborn')\n  \t```\n4. Update ProGuard config (Optional)\n  - Append the following lines to your ProGuard config (`proguard-rules.pro`)\n    ```\n    -keepattributes *Annotation*\n    -keepclassmembers class ** {\n      @org.greenrobot.eventbus.Subscribe \u003cmethods\u003e;\n    }\n    -keep enum org.greenrobot.eventbus.ThreadMode { *; }\n    ```\n\n## Usage\n\nMethods       | Action\n------------- | ------\n`open`        | Opens the url with Safari in a modal on iOS using **SFSafariViewController**, and Chrome in a new custom tab on Android. On iOS, the modal Safari will not share cookies with the system Safari.\n`close`       | Dismisses the system's presented web browser.\n`openAuth`    | Opens the url with Safari in a modal on iOS using **SFAuthenticationSession/ASWebAuthenticationSession**, and Chrome in a new custom tab on Android. On iOS, the user will be asked whether to allow the app to authenticate using the given url **(OAuth flow with deep linking redirection)**.\n`closeAuth`   | Dismisses the current authentication session.\n`isAvailable` | Detect if the device supports this plugin.\n`onStart`   | Initialize a bound background service so the application can communicate its intention to the browser. After the service is connected, the client can be used to Warms up the browser to make navigation faster and indicates that a given URL may be loaded in the future. - Android Only.\n`warmup`   | Warm up the browser process - Android Only.\n`mayLaunchUrl` | Tells the browser of a likely future navigation to a URL. The most likely URL has to be specified first. Optionally, a list of other likely URLs can be provided. They are treated as less likely than the first one, and have to be sorted in decreasing priority order. These additional URLs may be ignored. All previous calls to this method will be deprioritized - Android Only.\n\n### iOS Options\n\nProperty       | Description\n-------------- | ------\n`dismissButtonStyle` (String)        | The style of the dismiss button. [`done`/`close`/`cancel`]\n`preferredBarTintColor` (String)     | The color to tint the background of the navigation bar and the toolbar. [`white`/`#FFFFFF`]\n`preferredControlTintColor` (String) | The color to tint the control buttons on the navigation bar and the toolbar. [`gray`/`#808080`]\n`readerMode` (Boolean)               | A value that specifies whether Safari should enter Reader mode, if it is available. [`true`/`false`]\n`animated` (Boolean)                 | Animate the presentation. [`true`/`false`]\n`modalPresentationStyle` (String)    | The presentation style for modally presented view controllers. [`automatic`/`none`/`fullScreen`/`pageSheet`/`formSheet`/`currentContext`/`custom`/`overFullScreen`/`overCurrentContext`/`popover`]\n`modalTransitionStyle` (String)      | The transition style to use when presenting the view controller. [`coverVertical`/`flipHorizontal`/`crossDissolve`/`partialCurl`]\n`modalEnabled` (Boolean)             | Present the **SafariViewController** modally or as push instead. [`true`/`false`]\n`enableBarCollapsing` (Boolean)      | Determines whether the browser's tool bars will collapse or not. [`true`/`false`]\n`ephemeralWebSession` (Boolean)      | Prevent re-use cookies of previous session (openAuth only) [`true`/`false`]\n`formSheetPreferredContentSize` (Object)      | Custom size for iPad `formSheet` modals [`{width: 400, height: 500}`]\n\n### Android Options\nProperty       | Description\n-------------- | ------\n`showTitle` (Boolean)   | Sets whether the title should be shown in the custom tab. [`true`/`false`]\n`toolbarColor` (String)           | Sets the toolbar color. [`gray`/`#808080`]\n`secondaryToolbarColor` (String)  | Sets the color of the secondary toolbar. [`white`/`#FFFFFF`]\n`navigationBarColor` (String)     | Sets the navigation bar color. [`gray`/`#808080`]\n`navigationBarDividerColor` (String) | Sets the navigation bar divider color.  [`white`/`#FFFFFF`]\n`enableUrlBarHiding` (Boolean)    | Enables the url bar to hide as the user scrolls down on the page. [`true`/`false`]\n`enableDefaultShare` (Boolean)    | Adds a default share item to the menu. [`true`/`false`]\n`animations` (Object)             | Sets the start and exit animations. [`{ startEnter, startExit, endEnter, endExit }`]\n`headers` (Object)                | The data are key/value pairs, they will be sent in the HTTP request headers for the provided url. [`{ 'Authorization': 'Bearer ...' }`]\n`forceCloseOnRedirection` (Boolean) | Open Custom Tab in a new task to avoid issues redirecting back to app scheme. [`true`/`false`]\n`hasBackButton` (Boolean)         | Sets a back arrow instead of the default `X` icon to close the custom tab. [`true`/`false`]\n`browserPackage` (String)         | Package name of a browser to be used to handle Custom Tabs.\n`showInRecents` (Boolean)         | Determining whether browsed website should be shown as separate entry in Android recents/multitasking view. [`true`/`false`]\n`includeReferrer` (Boolean)         | Determining whether to include your package name as referrer for the website to track. [`true`/`false`]\n\n### Demo\n\n```javascript\nimport { Linking, Alert } from 'react-native'\nimport { InAppBrowser } from 'react-native-inappbrowser-reborn'\n\n...\n  async sleep(timeout) {\n    return new Promise(resolve =\u003e setTimeout(resolve, timeout))\n  }\n  async openLink() {\n    try {\n      const url = 'https://github.com/proyecto26'\n      if (await InAppBrowser.isAvailable()) {\n        const result = await InAppBrowser.open(url, {\n          // iOS Properties\n          dismissButtonStyle: 'cancel',\n          preferredBarTintColor: '#453AA4',\n          preferredControlTintColor: 'white',\n          readerMode: false,\n          animated: true,\n          modalPresentationStyle: 'fullScreen',\n          modalTransitionStyle: 'coverVertical',\n          modalEnabled: true,\n          enableBarCollapsing: false,\n          // Android Properties\n          showTitle: true,\n          toolbarColor: '#6200EE',\n          secondaryToolbarColor: 'black',\n          navigationBarColor: 'black',\n          navigationBarDividerColor: 'white',\n          enableUrlBarHiding: true,\n          enableDefaultShare: true,\n          forceCloseOnRedirection: false,\n          // Specify full animation resource identifier(package:anim/name)\n          // or only resource name(in case of animation bundled with app).\n          animations: {\n            startEnter: 'slide_in_right',\n            startExit: 'slide_out_left',\n            endEnter: 'slide_in_left',\n            endExit: 'slide_out_right'\n          },\n          headers: {\n            'my-custom-header': 'my custom header value'\n          }\n        })\n        await this.sleep(800);\n        Alert.alert(JSON.stringify(result))\n      }\n      else Linking.openURL(url)\n    } catch (error) {\n      Alert.alert(error.message)\n    }\n  }\n...\n```\n\n### Android Optimizations\n\nOn Android, you can warmup the in app browser client to make it launch siginificantly faster. To do so, add the following to your `MainActivity`\n\n```java\nimport com.proyecto26.inappbrowser.RNInAppBrowserModule;\n\npublic class MainActivity extends ReactActivity {\n\n  @Override\n  protected void onStart() {\n    super.onStart();\n    RNInAppBrowserModule.onStart(this);\n  }\n\n}\n```\n\nYou can further optimize performance and pre-render pages [by providing the urls that the user is likely to open](https://developer.chrome.com/docs/android/custom-tabs/best-practices/#pre-render-content).\n\n```javascript\n// Do not call this every time the component render\nuseEffect(() =\u003e {\n  InAppBrowser.mayLaunchUrl(\"Url user has high chance to open\", [\"Other urls that user might open ordered by priority\"]);\n}, []);\n```\n\n### Authentication Flow using Deep Linking\n\nIn order to redirect back to your application from a web browser, you must specify a unique URI to your app. To do this,\ndefine your app scheme and replace `my-scheme` and `my-host` with your info.\n\n- Enable deep linking (Android) - **[AndroidManifest.xml](https://github.com/proyecto26/react-native-inappbrowser/blob/main/example/android/app/src/main/AndroidManifest.xml#L23)**\n```\n\u003cactivity\n  ...\n  android:launchMode=\"singleTask\"\u003e\n  \u003cintent-filter\u003e\n      \u003caction android:name=\"android.intent.action.VIEW\" /\u003e\n      \u003ccategory android:name=\"android.intent.category.DEFAULT\" /\u003e\n      \u003ccategory android:name=\"android.intent.category.BROWSABLE\" /\u003e\n      \u003cdata android:scheme=\"my-scheme\" android:host=\"my-host\" android:pathPrefix=\"\" /\u003e\n  \u003c/intent-filter\u003e\n\u003c/activity\u003e\n```\n\n- Enable deep linking (iOS) - **[Info.plist](https://github.com/proyecto26/react-native-inappbrowser/blob/main/example/ios/example/Info.plist#L23)**\n```\n\u003ckey\u003eCFBundleURLTypes\u003c/key\u003e\n\u003carray\u003e\n  \u003cdict\u003e\n    \u003ckey\u003eCFBundleTypeRole\u003c/key\u003e\n    \u003cstring\u003eEditor\u003c/string\u003e\n    \u003ckey\u003eCFBundleURLName\u003c/key\u003e\n    \u003cstring\u003emy-scheme\u003c/string\u003e\n    \u003ckey\u003eCFBundleURLSchemes\u003c/key\u003e\n    \u003carray\u003e\n      \u003cstring\u003emy-scheme\u003c/string\u003e\n    \u003c/array\u003e\n  \u003c/dict\u003e\n\u003c/array\u003e\n```\n\n- utilities.js\n```javascript\nimport { Platform } from 'react-native'\nexport const getDeepLink = (path = '') =\u003e {\n  const scheme = 'my-scheme'\n  const prefix = Platform.OS == 'android' ? `${scheme}://my-host/` : `${scheme}://`\n  return prefix + path\n}\n```\n- App.js ([Using react-navigation with Deep Linking](https://reactnavigation.org/docs/en/deep-linking.html))\n```javascript\nimport { Root } from 'native-base'\nimport { createStackNavigator } from 'react-navigation'\nimport { getDeepLink } from './utilities'\n\nconst Main = createStackNavigator(\n  {\n    SplashComponent: { screen: SplashComponent },\n    LoginComponent: { screen: LoginComponent },\n    HomeComponent: { screen: HomeComponent },\n    CallbackComponent: { //Redirect users to the Home page if they are authenticated, otherwise to Login page...\n      screen: CallbackComponent,\n      path: 'callback/' //Enable Deep linking redirection to get the auth_token\n    }\n  },\n  {\n    index: 0,\n    initialRouteName: 'SplashComponent',\n    headerMode: 'none'\n  }\n)\n...\n  render() {\n    return (\n      \u003cRoot\u003e\n        \u003cMain uriPrefix={getDeepLink()} /\u003e\n      \u003c/Root\u003e\n    )\n  }\n...\n```\n\n- LoginComponent\n```javascript\nimport { Linking } from 'react-native'\nimport { InAppBrowser } from 'react-native-inappbrowser-reborn'\nimport { getDeepLink } from './utilities'\n...\n  async onLogin() {\n    const deepLink = getDeepLink('callback')\n    const url = `https://my-auth-login-page.com?redirect_uri=${deepLink}`\n    try {\n      if (await InAppBrowser.isAvailable()) {\n        InAppBrowser.openAuth(url, deepLink, {\n          // iOS Properties\n          ephemeralWebSession: false,\n          // Android Properties\n          showTitle: false,\n          enableUrlBarHiding: true,\n          enableDefaultShare: false\n        }).then((response) =\u003e {\n          if (\n            response.type === 'success' \u0026\u0026\n            response.url\n          ) {\n            Linking.openURL(response.url)\n          }\n        })\n      } else Linking.openURL(url)\n    } catch (error) {\n      Linking.openURL(url)\n    }\n  }\n...\n```\n\n- SplashComponent\n```javascript\n...\n  async componentDidMount() {\n    // Play Lottie Animation :)\n\n    // Validate the stored access token (Maybe with a request)\n    // Redirect the user to the Home page if the token is still valid\n    // Otherwise redirect to the Login page\n  }\n...\n```\n\n- CallbackComponent\n```javascript\n...\n  async componentDidMount() {\n    // Play Lottie Animation :)\n    try {\n      await this.loadUserInfo()\n      // Redirect to the Home page\n    } catch (error) {\n      // Show error and redirect the user to the Login page\n    }\n  }\n\n  async loadUserInfo() {\n    const { navigation } = this.props\n    const { state: { params } } = navigation\n    const { code, error } = params || {}\n\n    if (code) {\n      // Get and Save the access token request, user info...\n    }\n    else {\n      return Promise.reject(new Error(error))\n    }\n  }\n...\n```\n\n### StatusBar\n\nThe StatusBar will keep the last one provided in your app. So if the StatusBar is `dark-content` before you open the browser this will keep it.\n\nStarting with React Native 0.59 onwards, there is a simpler way of handling this update, without the need of patching StatusBar.\n```javascript\n  async openInBrowser(url) {\n    try {\n      const oldStyle = StatusBar.pushStackEntry({ barStyle: 'dark-content', animated: false });\n      await InAppBrowser.open(url)\n      StatusBar.popStackEntry(oldStyle);\n    } catch (error) {\n      Alert.alert(error.message)\n    }\n  })\n```\n\nFor previous versions, you can still apply the method described below.\n\nIf you want to change before opening you can do something like\n\n```javascript\n  async openInBrowser(url) {\n    try {\n      StatusBar.setBarStyle('dark-content')\n      await InAppBrowser.open(url)\n    } catch (error) {\n      Alert.alert(error.message)\n    }\n  })\n```\n\nIf you need to restore the old bar style, after the browser is dismissed, you can try and patch the StatusBar.setBarStyle function to store the old value like so:\n\n```js\n// patch StatusBar.setBarStyle to make style accessible\nconst _setBarStyle = StatusBar.setBarStyle\nStatusBar.setBarStyle = (style) =\u003e {\n  StatusBar.currentStyle = style\n  _setBarStyle(style)\n}\n```\n\nYou can than restore the old bar style after the browser has been dismissed like this:\n\n```javascript\n  async openInBrowser(url) {\n    try {\n      const oldStyle = StatusBar.currentStyle\n      StatusBar.setBarStyle('dark-content')\n      await InAppBrowser.open(url)\n      if(oldStyle) StatusBar.setBarStyle(oldStyle)\n    } catch (error) {\n      Alert.alert(error.message)\n    }\n  })\n```\n\n### Authentication\n\nUsing in-app browser tabs (like SFAuthenticationSession/ASWebAuthenticationSession and Android Custom Tabs) where available. Embedded user-agents, known as web-views (like UIWebView and WKWebView), are explicitly not supported due to the usability and security reasons documented in [Section 8.12 of RFC 8252](https://tools.ietf.org/html/rfc8252#section-8.12).\n\n## Credits 👍\n* **Expo:** [WebBrowser](https://docs.expo.io/versions/latest/sdk/webbrowser)\n* **React Native Custom Tabs:** [Chrome Custom Tabs for React Native](https://github.com/droibit/react-native-custom-tabs)\n* **React Native Safari View:** [A React Native wrapper for Safari View Controller](https://github.com/naoufal/react-native-safari-view)\n\n## Contributing ✨\nWhen contributing to this repository, please first discuss the change you wish to make via issue, email, or any other method with the owners of this repository before making a change.\nContributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated** ❤️.\nYou can learn more about how you can contribute to this project in the [contribution guide](https://github.com/proyecto26/react-native-inappbrowser/blob/develop/CONTRIBUTING.md).\n\n## Contributors ✨\nPlease do contribute! Issues and pull requests are welcome.\n\n### Code Contributors\n\nThis project exists thanks to all the people who contribute. [[Contribute](CONTRIBUTING.md)].\n\u003ca href=\"https://github.com/proyecto26/react-native-inappbrowser/graphs/contributors\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/contributors.svg?width=890\u0026button=false\" /\u003e\u003c/a\u003e\n\n### Financial Contributors\n\nBecome a financial contributor and help us sustain our community. [[Contribute](https://opencollective.com/proyecto26/contribute)]\n\n#### Individuals\n\n\u003ca href=\"https://opencollective.com/proyecto26\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/individuals.svg?width=890\"\u003e\u003c/a\u003e\n\n#### Organizations\n\nSupport this project with your organization. Your logo will show up here with a link to your website. [[Contribute](https://opencollective.com/proyecto26/contribute)]\n\n\u003ca href=\"https://opencollective.com/proyecto26/organization/0/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/0/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/1/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/1/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/2/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/2/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/3/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/3/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/4/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/4/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/5/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/5/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/6/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/6/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/7/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/7/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/8/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/8/avatar.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://opencollective.com/proyecto26/organization/9/website\"\u003e\u003cimg src=\"https://opencollective.com/proyecto26/organization/9/avatar.svg\"\u003e\u003c/a\u003e\n\n## Supporting 🍻\nI believe in Unicorns 🦄\nSupport [me](http://www.paypal.me/jdnichollsc/2), if you do too.\n\nDonate **Ethereum**, **ADA**, **BNB**, **SHIBA**, **USDT/USDC**, **DOGE**, etc:\n\n\u003e Wallet address: jdnichollsc.eth\n\nPlease let us know your contributions! 🙏\n\n## Enterprise 💼\n\nAvailable as part of the Tidelift Subscription.\n\nThe maintainers of InAppBrowser for React Native and thousands of other packages are working with Tidelift to deliver commercial support and maintenance for the open source dependencies you use to build your applications. Save time, reduce risk, and improve code health, while paying the maintainers of the exact dependencies you use. [Learn more.](https://tidelift.com/subscription/pkg/npm-react-native-inappbrowser-reborn?utm_source=npm-react-native-inappbrowser-reborn\u0026utm_medium=referral\u0026utm_campaign=enterprise\u0026utm_term=repo)\n\n## Security contact information 🚨\nTo report a security vulnerability, please use the [Tidelift security contact](https://tidelift.com/security). Tidelift will coordinate the fix and disclosure.\n\n## License ⚖️\nThis repository is available under the [MIT License](https://github.com/proyecto26/react-native-inappbrowser/blob/develop/LICENSE).\n\n## Happy coding 💯\nMade with ❤️\n\n\u003cimg width=\"150px\" src=\"https://avatars0.githubusercontent.com/u/28855608?s=200\u0026v=4\" align=\"right\"\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fproyecto26%2Freact-native-inappbrowser","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fproyecto26%2Freact-native-inappbrowser","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fproyecto26%2Freact-native-inappbrowser/lists"}