expo-web-browser

What is expo-web-browser?

The expo-web-browser package provides an API to open web pages in a browser within an Expo app. It allows developers to open URLs in a web browser or an in-app browser, providing a seamless user experience.

What are expo-web-browser's main functionalities?

Open a URL in the system's web browser

This feature allows you to open a URL in the system's default web browser. The `openBrowserAsync` function takes a URL as an argument and opens it in the browser.

import * as WebBrowser from 'expo-web-browser';

async function openBrowser() {
  let result = await WebBrowser.openBrowserAsync('https://example.com');
  console.log(result);
}

Open a URL in an in-app browser

This feature allows you to open a URL in an in-app browser with additional options like reader mode and bar collapsing. The `openBrowserAsync` function can take a second argument with options to customize the in-app browser.

import * as WebBrowser from 'expo-web-browser';

async function openInAppBrowser() {
  let result = await WebBrowser.openBrowserAsync('https://example.com', {
    readerMode: true,
    enableBarCollapsing: true
  });
  console.log(result);
}

Dismiss the in-app browser

This feature allows you to programmatically dismiss the in-app browser. The `dismissBrowser` function can be called to close the in-app browser if it is open.

import * as WebBrowser from 'expo-web-browser';

function dismissBrowser() {
  WebBrowser.dismissBrowser();
}

Other packages similar to expo-web-browser

react-native-inappbrowser-reborn

The react-native-inappbrowser-reborn package provides similar functionality to expo-web-browser, allowing you to open URLs in an in-app browser. It offers more customization options and supports both Android and iOS. However, it requires linking and additional setup compared to the seamless integration of expo-web-browser in Expo projects.

react-native-webview

The react-native-webview package allows you to embed web content directly within your React Native application. Unlike expo-web-browser, which opens a separate browser window, react-native-webview provides a component to render web content inline. This package is more suitable for cases where you need to display web content as part of your app's UI.

README

expo-web-browser

Provides access to the system's web browser and supports handling redirects. On iOS, it uses SFSafariViewController or SFAuthenticationSession, depending on the method you call, and on Android it uses ChromeCustomTabs. As of iOS 11, SFSafariViewController no longer shares cookies with the Safari, so if you are using WebBrowser for authentication you will want to use WebBrowser.openAuthSessionAsync, and if you just want to open a webpage (such as your app privacy policy), then use WebBrowser.openBrowserAsync.

API documentation

• Documentation for the master branch
• Documentation for the latest stable release

Installation

This package is pre-installed in managed Expo projects. You may skip the rest of the installation guide if this applies to you.

For bare React Native projects, you must ensure that you have installed and configured the react-native-unimodules package before continuing.

Add the package to your npm dependencies

npm install expo-web-browser

Configure for iOS

Run pod install in the ios directory after installing the npm package.

Configure for Android

No additional set up necessary.

Contributing

Contributions are very welcome! Please refer to guidelines described in the contributing guide.