Skip to main content

Working with Sharing and Links

1. Sharing Content

Method Description Notes
Share.open() Opens the native sharing dialog to share content Supports text, URLs, and images
Share.isAvailable() Checks if sharing is available on the device Returns a boolean value

Example: Sharing Text

import * as Share from 'expo-share';\n\nconst shareText = async () => {\n  const result = await Share.open({\n    message: 'Check out this awesome app!',\n  });\n\n  if (result.dismissedAction) {\n    console.log('Share dismissed');\n  }\n};

Example: Sharing URL

import * as Share from 'expo-share';\n\nconst shareUrl = async () => {\n  const result = await Share.open({\n    url: 'https://expo.dev',\n  });\n\n  if (result.dismissedAction) {\n    console.log('Share dismissed');\n  }\n};
Note: On web, the sharing action will open a new window with the content to be shared.

2. Using Share Dialog

The Share API in Expo allows you to share content from your app with other apps installed on the device. It supports sharing text, URLs, images, and files.

Property Description Values
content The content to be shared. This can be a string, an object with title and text, or an array of content items. string, object, array
url The URL to be shared. This is typically used when sharing a web link. string
mimeType The MIME type of the content being shared. This is useful for sharing files. string
dialogTitle The title of the share dialog. This is optional and defaults to "Share". string

Example: Sharing Text

import * as Share from 'expo-share';

const shareText = async () => {
  await Share.share({
    content: 'Hello, world!',
    dialogTitle: 'Share this text'
  });
};

Example: Sharing a URL

import * as Share from 'expo-share';

const shareUrl = async () => {
  await Share.share({
    url: 'https://expo.dev',
    dialogTitle: 'Share this link'
  });
};

Example: Sharing an Image

import * as Share from 'expo-share';

const shareImage = async () => {
  await Share.share({
    content: 'Check out this image!',
    url: 'https://example.com/image.jpg',
    mimeType: 'image/jpeg',
    dialogTitle: 'Share this image'
  });
};
Note: The Share API is not available in all environments. It works in standalone apps and managed apps, but not in the Expo Go client.

3. Checking Sharing Availability

Property Description Values Notes
Sharing.isAvailable Indicates if sharing is available on the current platform true | false Available in Expo Go and bare workflow apps

Example: Check Sharing Availability

import * as Sharing from 'expo-sharing';

const isAvailable = Sharing.isAvailable;
console.log('Sharing available:', isAvailable);

4. Sending SMS Messages

Property Description Values
expo-constants Provides access to constants like the app's bundle ID Constants.manifest?.id
expo-sharing Enables sharing content via system share sheets Sharing.shareAsync

Example: Sending SMS via Expo

import * as Sharing from 'expo-sharing';
import Constants from 'expo-constants';

const sendSMS = async () => {
  const message = 'Hello from Expo!';
  const phoneNumber = '+1234567890';

  try {
    const result = await Sharing.shareAsync(
      `sms:${phoneNumber}?body=${encodeURIComponent(message)}`,
      { mimeType: 'text/plain' }
    );
  } catch (error) {
    console.error('Failed to send SMS:', error);
  }
};
Note: The sms: URI scheme is supported on iOS and Android, but behavior varies by platform.
Warning: SMS functionality is limited to the system’s default messaging app and requires user interaction.

5. Composing SMS

Property Description Values
to The phone number(s) to send the SMS to string | string[]
body The message content to send string
cc CC recipients (optional) string | string[]
bcc BCC recipients (optional) string | string[]

Example: Compose SMS with Expo

import { SMS } from 'expo-sms';

const sendSMS = async () => {
  const isAvailable = await SMS.isAvailableAsync();
  if (isAvailable) {
    const result = await SMS.sendSMSAsync(
      '+1234567890',
      'Hello from Expo!'
    );
    console.log('SMS sent:', result);
  } else {
    console.log('SMS not available on this device');
  }
};
Note: The sendSMSAsync function requires the SEND_SMS permission on Android and is only available on physical devices.

6. Sending Email

Property Description Values
to Email address to send the email to string
subject Subject line of the email string
body Body content of the email string
cc CC email addresses string[]
bcc BCC email addresses string[]

Example: Sending an Email

import * as Sharing from 'expo-sharing';

const emailOptions = {
  to: 'user@example.com',
  subject: 'Hello from Expo!',
  body: 'This is a test email sent from an Expo app.'
};

Sharing.sendToInboxAsync(emailOptions);
Note: The sendToInboxAsync method only works on devices that have an email client configured.
Warning: Ensure that the email address is valid and properly formatted to avoid delivery issues.

7. Composing Email

Property Description Values
to Email address of the recipient string
cc CC email addresses string[]
bcc BCC email addresses string[]
subject Subject line of the email string
body Body content of the email string

Example: Compose Email

import { openComposer } from 'expo-sharing';

const email = {
  to: 'recipient@example.com',
  subject: 'Hello from Expo!',
  body: 'This is a test email sent via Expo.',
};

openComposer(email);

8. Making Phone Calls

Property Values Description
phone string The phone number to call
prompt boolean Whether to show a prompt before calling

Example: Making a Phone Call

import { makePhoneCall } from 'expo-constants';

makePhoneCall('123-456-7890');
Note: The phone number must be a valid format for the device's operating system.
Warning: This feature requires the CALL_PHONE permission on Android.

9. Opening External URLs

Property Description Example
url The external URL to open https://expo.dev

Example: Opening an External URL

import * as Linking from 'expo-linking';

const openExternalUrl = () => {
  Linking.openURL('https://expo.dev');
};
Note: Ensure the URL is properly formatted and accessible to avoid navigation errors.
Property Description Example
useDeepLink Hook to handle deep links in Expo apps const { pathname, params } = useDeepLink();
Linking Module for handling deep links and URL schemes Linking.openURL('exp://192.168.0.1:8081');
import { useDeepLink } from 'expo';\n\nconst handleDeepLink = () => {\n  const { pathname, params } = useDeepLink();\n  console.log('Pathname:', pathname);\n  console.log('Params:', params);\n};
import { Linking } from 'expo';\n\nconst openDeepLink = () => {\n  Linking.openURL('exp://192.168.0.1:8081');\n};
Note: Deep links in Expo apps can be handled via the Linking API or through the useDeepLink hook. Ensure that your app's configuration includes proper URL scheme definitions in app.json.
Warning: Make sure to handle deep links securely, especially when passing sensitive data through URL parameters.

11. Parsing URL Parameters

Parameter Description Example
url The full URL string to parse "https://expo.dev/@user/project?param1=value1&param2=value2"
paramName Name of the query parameter to extract "param1"

Example: Extracting a Single Parameter

import { parse } from 'expo-linking';\n\nconst url = 'https://expo.dev/@user/project?param1=value1&param2=value2';\nconst paramValue = parse(url).query.param1;\nconsole.log(paramValue); // "value1"

Example: Extracting All Parameters

import { parse } from 'expo-linking';\n\nconst url = 'https://expo.dev/@user/project?param1=value1&param2=value2';\nconst parsed = parse(url);\nconsole.log(parsed.query); // { param1: "value1", param2: "value2" }
Note: The parse function returns a structured object with query, path, and other components of the URL.

App Links in Expo allow you to create deep links into your app from external sources like emails, SMS, or other apps. These links can open specific screens or pass data to your app.

Property Description Example
expo-linking Library for handling deep links in Expo apps. import * as Linking from 'expo-linking';
deepLink URL that opens the app to a specific screen. exp://192.168.1.100:8081/--/my-screen
import * as Linking from 'expo-linking';

const prefix = Linking.createURL('/');

export default function App() {
  return (
    <View style={styles.container}>
      <Text>Open app with deep link</Text>
    </View>
  );
}
import * as Linking from 'expo-linking';

const handleDeepLink = (url) => {
  console.log('Received deep link:', url);
};

Linking.addEventListener('url', handleDeepLink);

export default function App() {
  return (
    <View style={styles.container}>
      <Text>App is listening for deep links</Text>
    </View>
  );
}
Note: Make sure to configure your app's scheme in app.json or app.config.js to handle deep links correctly.
Warning: Deep links may not work in development mode without proper configuration.

Was this article helpful?