---
title: "エラー対応"
slug: "vpe-tv-error-handling"
updated: 2026-09-17T09:22:05Z
published: 2026-09-17T09:22:05Z
canonical: "guide.ncloud-docs.com/vpe-tv-error-handling"
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環境で利用できます。

TV SDKでカスタムエラー UIを設定する方法をご案内します。

## errorOverride

デフォルトのエラー UIの代わりに、カスタムエラー UIをレンダリングできます。`errorOverride` propにレンダー関数、Reactコンポーネント、または ReactNodeを渡します。

## PlayerErrorInfo

カスタムエラー UIに渡されるエラー情報オブジェクトのタイプは、次の通りです。

```
type PlayerErrorInfo = {
    errorCode: string | null;
    errorMessage: string | null;
    errorTitle: string | null;
};
```

## 方法1: レンダー関数

`errorOverride`にレンダー関数を渡すと、エラー情報を受け取って UIを直接構築できます。

```
<VpePlayer
    accessKey="YOUR_ACCESS_KEY"
    options={{ playlist: [{ file: 'https://example.com/video.m3u8' }] }}
    errorOverride={(info) => (
        <View style={{
            flex: 1,
            justifyContent: 'center',
            alignItems: 'center',
            backgroundColor: '#000',
        }}>
            <Text style={{ color: '#fff', fontSize: 18 }}>
                エラー: {info.errorCode}
            </Text>
            <Text style={{ color: '#aaa', fontSize: 14, marginTop: 8 }}>
                {info.errorMessage}
            </Text>
        </View>
    )}
    onBack={() => navigation.goBack()}
/>
```

## 方法2: Reactコンポーネント

`errorOverride`に Reactコンポーネントを渡すことができます。コンポーネント `PlayerErrorInfo`を propsとして受け取ります。

```
function MyErrorComponent({ errorCode, errorMessage }: PlayerErrorInfo) {
    return (
        <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
            <Text style={{ color: '#fff' }}>エラー: {errorCode}</Text>
            <Text style={{ color: '#aaa' }}>{errorMessage}</Text>
        </View>
    );
}

<VpePlayer
    accessKey="YOUR_ACCESS_KEY"
    options={{ playlist: [{ file: 'https://example.com/video.m3u8' }] }}
    errorOverride={MyErrorComponent}
    onBack={() => navigation.goBack()}
/>
```

## 方法3: ReactNode

`errorOverride`に静的な ReactNodeを直接渡すことができます。

```
<VpePlayer
    accessKey="YOUR_ACCESS_KEY"
    options={{ playlist: [{ file: 'https://example.com/video.m3u8' }] }}
    errorOverride={
        <Text style={{ color: '#fff' }}>再生できない動画です</Text>
    }
    onBack={() => navigation.goBack()}
/>
```

## イベントによるエラー検出

`onEvent`の `error` イベントでもエラーを検出できます。

```
<VpePlayer
    accessKey="YOUR_ACCESS_KEY"
    options={{ playlist: [{ file: 'https://example.com/video.m3u8' }] }}
    onEvent={(event) => {
        if (event.type === 'error') {
            console.log('エラー発生:', event.data);
        }
    }}
    onBack={() => navigation.goBack()}
/>
```

## よくある問題

### Q.再生できません。

- `accessKey`が有効か確認
- `playlist`に `file`が含まれているか確認
- ストリーム URLにアクセスできるか確認

### Q.DRMの再生に失敗します。

- DRMはシミュレータやエミュレータでは動作しないため、実デバイスでのテストが必須
- Android TVは Widevine、tvOSは FairPlayを確認

### Q.IMAの広告が表示されません。

- ネイティブビルドフラグを確認(tvOS: `&#x24;RNVideoUseGoogleIMA = true`、Android: `RNVideo_useExoplayerIMA=true`)
- フラグ変更後、アプリの再ビルドが必須

### Q.Android TVで D-padが動作しません。

- エミュレータ `config.ini`で `hw.keyboard = yes` を確認
- 変更後、エミュレータを再起動