Runtime Environment

1. Checking the running platform (getPlatformOS)

getPlatformOSis a function that checks the currently running platform. react-nativeof Platform.OS It operates based on the value, ios or android and returns one of the strings.

Signature

function getPlatformOS(): 'ios' | 'android';

Return value

• 'ios' | 'android'

  the currently running platform

Example

import { getPlatformOS } from '@apps-in-toss/framework';
import { Text } from 'react-native';

function Page() {
  const platform = getPlatformOS();

  return <Text>Current platform: {platform}</Text>;
}

---

2. Checking the application environment (getOperationalEnvironment)

getOperationalEnvironment Use the function to check which deployment environment the app is currently running in (e.g.: sandbox, Toss) you can check whether it is running there. If it's running in the Toss app, 'toss', and if it's running in a sandbox environment, 'sandbox'is returned.

The operational environment refers to the context in which the app runs, and it can be used to determine whether specific features are available.

Signature

function getOperationalEnvironment(): 'toss' | 'sandbox';

Return value

It is a string representing the current operational environment.

• 'toss' | 'sandbox'

  'toss': Running in the Toss app. 'sandbox': Running in the sandbox environment.

Example

js

import { getOperationalEnvironment } from '@apps-in-toss/web-framework';

const environment = getOperationalEnvironment();

React

import { getOperationalEnvironment } from '@apps-in-toss/web-framework';
import { Text } from '@toss/tds-mobile';

function EnvironmentInfo() {
  const environment = getOperationalEnvironment();

  return <Text>{`The current execution environment is '${environment}'.`}</Text>;
}

React Native

import { getOperationalEnvironment } from '@apps-in-toss/framework';
import { Text } from '@toss/tds-react-native';

function EnvironmentInfo() {
  const environment = getOperationalEnvironment();

  return <Text>{`The current execution environment is '${environment}'.`}</Text>;
}

Some features may need to be provided only in specific deployment environments. Below is sandbox an example of providing special features only in a given environment.

import { View, Text } from 'react-native';
import { getOperationalEnvironment } from '@apps-in-toss/framework';

const isSandbox = getOperationalEnvironment() === 'sandbox'; // variable that checks whether the environment is 'sandbox'

function Component() {
  const handlePress = () => {
    if (isSandbox) {
      // feature to provide in the 'sandbox' environment
    } else {
      // feature to provide in other environments
    }
  };

  return <Button onPress={handlePress}>View details</Button>;
}

---

3. Checking the device's unique identifier (getDeviceId)

getDeviceId The function returns the unique identifier of the device being used as a string. It can be used to save settings or data per device, or to identify the user's device for logging and analysis. It's also useful for distinguishing multiple devices used by the same user.

Signature

function getDeviceId(): string;

Return value

• string

  It is a string representing the device's unique identifier.

Example

js

import { getDeviceId } from '@apps-in-toss/web-framework';

const deviceId = getDeviceId();

React

import { getDeviceId } from '@apps-in-toss/web-framework';
import { useState } from 'react';

const DeviceInfo = () => {
  const [deviceId, setDeviceId] = useState<string | null>(null);

  const fetchDeviceId = async () => {
    setDeviceId(getDeviceId());
  };

  return (
    <div>
      <button onClick={fetchDeviceId}>Get device ID</button>
      {deviceId && <p>Device ID: {deviceId}</p>}

  );
};

React Native

import { getDeviceId } from '@apps-in-toss/framework';
import { Text } from '@toss/tds-react-native';

function MyPage() {
  const id = getDeviceId();

  return <Text>User's device unique identifier: {id}</Text>;
}

---

4. Getting the scheme value (getSchemeUri)

getSchemeUrireturns the scheme value used when the screen was first entered. URI changes caused by page navigation are not reflected.

Signature

function getSchemeUri(): string;

Return value

• string

  It returns the scheme value used when the screen was first entered.

Example

import { getSchemeUri } from '@apps-in-toss/framework';
import { Text } from 'react-native';

function MyPage() {
  const schemeUri = getSchemeUri();

  return <Text>Scheme value used when first entering the screen: {schemeUri}</Text>;
}