---
title: "플레이어 설치"
slug: "vpe-player-setting"
updated: 2026-08-20T09:03:39Z
published: 2026-08-20T09:03:39Z
canonical: "guide-gov.ncloud-docs.com/vpe-player-setting"
---

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

# 플레이어 설치

<p class="platform-info type-classic-vpc">Classic/VPC 환경에서 이용 가능합니다.</p>

이 페이지에서는 Expo 기반 환경에서 Video Player Enhancement React Native SDK를 활용해 플레이어를 설치·구동하기 위한 환경 설정을 설명합니다. 

## EXPO 기반 라이브러리 <a name="EXPO기반라이브러리"></a>
expo 환경에서 구동됩니다.

## Expo GO 지원 불가 <a name="ExpoGO지원 불가"></a>
VPE RN SDK 는 네이티브 브릿지를 사용하는 영역이 있어 Expo GO 테스트를 지원하지 않습니다.
Development build 를 이용해 주시기 바랍니다.

## React Native 0.68.2 이상 필요 <a name="ReactNative0682이상필요"></a>
React Native Video 라이브러리 V6.x 를 기반으로 서비스됩니다.
React Native 버전이 0.68.2 이상이어야 합니다. 

## npm 사용 <a name="npm사용"></a>

```Swift
npm install vpe-react-native
   ```
   
## 의존성 설치 <a name="의존성설치"></a>

```Swift
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 사전 설정 <a name=" iOS사전설정"></a>

:::(Info) (참고)
Expo로 빌드하는 경우 이 단계는 필요하지 않습니다.
:::

   ```Swift
cd ios && pod install
   ```
   
   ## 개발용 테스트 키 및 테스트용 AppId 설정 <a name="개발용테스트키및테스트용AppId설정"></a>
 Video Player Enhancement 는 AppId + AccessKey 조합으로 라이선스 체크를 실시합니다.
  Expo GO에서는 정식 AppId를 이용할 수 없어 개발 모드 전용 props 가 존재합니다.

 ```Swift
<VpePlayer
    ...
    devTestAppId={'TEST DEV AppID'} //EXPO GO 대응 , 개발모드에서만 사용됨
    accessKey={'VPE ACCESS KEY'} //AppID 와 일치하는 Access Key
    ...
/>
   ```
   
   
## app.json 설정 <a name="appjson설정"></a>
- plugins 항목 추가
- PictureInPicture 지원을 위한 옵션 추가
- Background play를 위한 옵션 추가 필요


 ```Swift
{
  "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"
      ]
      ...
    },
  }
}
   ```