プラットフォーム

isPlatform

isPlatformメソッドは、アプリが特定のプラットフォームで実行されているかどうかをテストするために使用できます。

import { isPlatform } from '@ionic/react';

isPlatform('ios'); // returns true when running on a iOS device

ユーザーが使用しているプラットフォームに応じて、isPlatform(platformName)はtrueまたはfalseを返します。同じアプリが複数のプラットフォーム名でtrueを返す場合があることに注意してください。たとえば、iPadで実行されているアプリは、mobile、ios、ipad、tabletのプラットフォーム名でtrueを返します。さらに、アプリがCordovaから実行されている場合は、cordovaがtrueになります。

getPlatforms

getPlatformsメソッドは、アプリが現在どのプラットフォームで実行されているかを判断するために使用できます。

import { getPlatforms } from '@ionic/react';

getPlatforms(); // returns ["iphone", "ios", "mobile", "mobileweb"] from an iPhone

使用しているデバイスに応じて、getPlatformsは複数の値を返すことができます。可能な各値は、プラットフォームの階層です。たとえば、iPhoneでは、mobile、ios、iphoneが返されます。

プラットフォーム

以下は、すべての可能なプラットフォーム値と対応する説明をリストした表です。

プラットフォーム名	説明
android	Androidを実行しているデバイス
capacitor	Capacitorを実行しているデバイス
cordova	Cordovaを実行しているデバイス
desktop	デスクトップデバイス
electron	Electronを実行しているデスクトップデバイス
hybrid	CapacitorまたはCordovaを実行しているデバイス
ios	iOSを実行しているデバイス
ipad	iPadデバイス
iphone	iPhoneデバイス
mobile	モバイルデバイス
mobileweb	モバイルデバイスで実行されているWebブラウザ
phablet	ファブレットデバイス
pwa	PWAアプリ
tablet	タブレットデバイス

プラットフォーム検出関数のカスタマイズ

特定のプラットフォームを検出するために使用される関数は、グローバルIonic設定で代替関数を指定することでオーバーライドできます。各関数はパラメーターとしてwindowを取り、ブール値を返します。

setupIonicReact({
  platform: {
    /** The default `desktop` function returns false for devices with a touchscreen.
     * This is not always wanted, so this function tests the User Agent instead.
     **/
    desktop: (win) => {
      const isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(win.navigator.userAgent);
      return !isMobile;
    },
  },
});

type PlatformConfig = {
  android?: ((win: Window) => boolean) | undefined;
  capacitor?: ((win: Window) => boolean) | undefined;
  cordova?: ((win: Window) => boolean) | undefined;
  desktop?: ((win: Window) => boolean) | undefined;
  electron?: ((win: Window) => boolean) | undefined;
  hybrid?: ((win: Window) => boolean) | undefined;
  ios?: ((win: Window) => boolean) | undefined;
  ipad?: ((win: Window) => boolean) | undefined;
  iphone?: ((win: Window) => boolean) | undefined;
  mobile?: ((win: Window) => boolean) | undefined;
  mobileweb?: ((win: Window) => boolean) | undefined;
  phablet?: ((win: Window) => boolean) | undefined;
  pwa?: ((win: Window) => boolean) | undefined;
  tablet?: ((win: Window) => boolean) | undefined;
};