---
title: "Props設定"
slug: "vpe-props-setting"
updated: 2026-09-17T09:22:05Z
published: 2026-09-17T09:22:05Z
canonical: "guide.ncloud-docs.com/vpe-props-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.
# Props設定
Classic/VPC環境で利用できます。
このページでは、プレイヤー構成時に使用できるプロパティについて説明します。
参考
Android、iOSで共通して適用されます。
## devTestAppId
VPEはアプリ IDベースのライセンスが設定されます。開発環境でアプリ IDを開発専用に設定して、タスクが行えるようにサポートするプロパティです。
```
```
## accessKey
VPEはライセンスキーを設定します。
```
```
## platform
VPE React Native SDKは民間(pub) / 公共(gov)をサポートします。デフォルト値は民間(pub)です。
```
```
## events
VPE React Native SDKでプレイヤーイベントをバインドする機能を提供します。
```
{
console.log('player ready')
},
fullScreen: (data) => {
setIsFullScreen(data.isFullScreen);
},
timeupdate: (data) => {
console.log('動画全体の長さ(duration) : ', data.duration);
console.log('現在の再生位置 (currentTime) : ', data.currentTime);
console.log('現在の再生パーセント(percent) : ', data.percent);
console.log('累計再生時間(viewingTime) : ', data.viewingTime);
console.log('再生ソースタイプ(sourceType) : ', data.sourceType); // 再生ソースタイプ(vod, live)
},
nextTrack: (data) => {
console.log(data);
},
prevTrack: (data) => {
console.log(data);
},
volumechange: (data) => {
console.log(data);
},
play: () => {
console.log('play');
},
pause: () => {
console.log('pause');
},
ended: () => {
console.log('ended');
},
controlbarActive: () => {
console.log('controlbarActive');
},
controlbarDeactive: () => {
console.log('controlbarDeactive');
},
error: (data) => {
console.log('error', data);
},
}}
...
>
```
| イベント | 説明 | リターン値 |
| --- | --- | --- |
| ready | プレイヤーロード完了 | - |
| fullScreen | フルスクリーン実行時に発生 | data.isFullScreen == true , false |
| timeupdate | 再生時に発生 | - duration: 動画全体の長さ - currentTime: 現在の再生位置 - percent: 現在の再生パーセント - viewingTime: 累計再生時間 - sourceType: 再生ソースタイプ(vod、live) |
| nextTrack | 次の映像に移動時に発生 | 次の映像の source |
| prevTrack | 前の映像に移動時に発生 | 前の映像の source |
| volumechange | プレイヤーボリューム変更時に発生 | ミュートの有無 |
| play | 再生開始時に発生 | - |
| pause | pause実行時に発生 | - |
| ended | 現在の映像の再生完了時に発生 | - |
| controlbarActive | コントロール UIが有効になった時 | - |
| controlbarDeactive | コントロール UIが無効になった時 | - |
| error | プレイヤーにエラーが発生した時 | - error_code: エラーコード - error_message: エラーメッセージ |
## options
VPEプレイヤーオプションを設定します。
```
```
- VPEプレイヤーオプションは別のページで説明します。
[Video Player Enhancementオプションガイド](/docs/ja/%EC%9E%AC%EC%83%9D%EA%B4%80%EB%A0%A8-%EC%98%B5%EC%85%98)
## backButton
VPEプレイヤーに巻き戻しボタンを追加します。
```
{ //巻き戻しボタンを追加
return (
{
//巻き戻しボタンを実現
}}
>
);
}}
...
>
```
## override
VPEプレイヤーに基本機能を直接 Overrideして望む機能を実現できます。
```
{
Alert.alert(`nextSource`);
},
prevSource: () => {
Alert.alert(`prevSource`);
},
fullscreen: () => {
Alert.alert(`fullscreen`);
},
}}
...
>
```
## errorOverride
基本的に提供されるエラー画面を顧客会社が希望するコードに変更して実行できます。 エラー画面をオーバーライドすると、次の変更画面のように最後の再生位置で停止(pause)ステータスを維持したままプレイヤーオーバーレイでエラー画面を実装できます。
```
{
return (
<>
⚠️
{res.error.title}
({res.error.desc})
サポートセンター: 1588-0001
);
}}
...
>
```
## カスタムボタン追加
customBtnsプロパティでプレイヤーにカスタムボタンを追加し、新しい機能を提供できます。 カスタムボタンは位置に関係なく最大4つまで追加できます。
positionおよび flowプロパティ設定ごとのカスタムボタンの位置は、次の通りです。
```
{
return (
{
Alert.alert('test11');
}}
>
);
},
},
{
position: 'right-top',
flow: 'left',
button: () => {
return (
{
Alert.alert('test11');
}}
>
);
},
},
]}
...
/>
```