---
title: "プレイヤーインストール"
slug: "vpe-player-setting"
updated: 2026-09-17T09:22:05Z
published: 2026-09-17T09:22:05Z
canonical: "guide.ncloud-docs.com/vpe-player-setting"
stale: true
---

> ## Documentation Index
> Fetch the complete documentation index at: https://guide.ncloud-docs.com/llms.txt
> Use this file to discover all available pages before exploring further.

# プレイヤーインストール

Classic/VPC環境で利用できます。

このページでは、Expo環境で Video Player Enhancement React Native SDKを活用してプレイヤーをインストール・起動するための環境設定について説明します。

## EXPOベースライブラリ

expo環境で起動します。

## Expo GOサポート不可

VPE RN SDKはネイティブブリッジを使用する領域があるため、Expo GOテストはサポートしません。 Development buildをご利用ください。

## React Native 0.68.2以上必要

React Native Videoライブラリ V6.xをベースにサービスを提供します。 React Nativeバージョンは0.68.2以上である必要があります。

## npm使用

```
npm install vpe-react-native
```

## 依存関係のセットアップ

```
npm install @sgrsoft/react-native-video react-native-svg react-native-capture-protection phosphor-react-native expo-screen-orientation expo-navigation-bar expo-localization expo-application
```

## iOSの事前設定

              参考

              

Expoでビルドする場合、この手順は必要ありません。

```
cd ios && pod install
```

## 開発用テストとテスト用 AppIdの設定

Video Player Enhancementは AppId + AccessKeyの組み合わせでライセンスをチェックします。 Expo GOでは正式 AppIdを利用できないため、開発モード専用の propsが存在します。

```
<VpePlayer
   ...
   devTestAppId={'TEST DEV AppID'} //EXPO GO対応、開発モードのみで使用
   accessKey={'VPE ACCESS KEY'} //AppIDと一致する Access Key
   ...
/>
```

## app.json設定

- plugins項目追加
- PictureInPictureサポートのためのオプション追加
- Background playのためのオプション追加が必要

```
{
 "expo": {
   ...
   "plugins": [
       [
           "react-native-capture-protection",
           {
               "captureType": "fullMediaCapture"
           }
       ],
       [
           "@sgrsoft/react-native-video",
           {
               "enableAndroidPictureInPicture": true,
               "enableNotificationControls": true
           }
       ]
   ],
   "ios": {
     ...
     "infoPlist": {
       "UIBackgroundModes": [
           "audio",
           "fetch"
       ]
     }
     ...
   },
   "android": {
     ...
     "edgeToEdgeEnabled": true,
     "supportsPictureInPicture": true,
     "permissions": [
           "android.permission.FOREGROUND_SERVICE"
     ]
     ...
   },
 }
}
```