

# IVS Player SDK: JW 플레이어 통합
<a name="player-jwplayer"></a>

이 문서에서는 Amazon Interactive Video Service(IVS) JW 플레이어 통합에서 사용할 수 있는 가장 중요한 기능에 대해 설명합니다.

**JW 플레이어 통합의 최신 버전:** 1.50.0([릴리스 정보](https://docs.aws.amazon.com/ivs/latest/LowLatencyUserGuide/release-notes.html#mar19-26-player-web-ll))

## 시작하기
<a name="jwplayer-getting-started"></a>

JW 플레이어에 대한 Amazon IVS 지원은 공급자를 통해 구현됩니다. Amazon IVS 공급자는 JW 플레이어의 웹 플레이어에서만 지원됩니다. 공급자는 스크립트 태그를 통해 로드되며, Amazon IVS 공급자 재생이 필요한 스트림에는 재생 목록에서 `type: 'ivs'` 태그가 지정되어야 합니다. Amazon IVS는 JW 플레이어 버전 8.18.4 이상을 지원합니다.

### 설정
<a name="jwplayer-getting-started-setup"></a>

이 지침에서, `JW_PLAYER_DIV`는 JW 플레이어 인스턴스의 `<div>` 이름이고 `IVS_STREAM`은 IVS 재생 URL입니다. Amazon IVS 공급자를 설정하고 재생을 활성화하려면 다음을 수행합니다.

1. 플레이어 통합의 최신 버전에 대해 다음 `script` 태그를 포함합니다(이 경우 1.50.0).

   ```
   <script src="https://player.live-video.net/1.50.0/amazon-ivs-jw-provider.min.js"></script>
   ```

1. `ivs` 유형을 사용하여 IVS 재생 목록 항목을 표시합니다. `setup()`에서 `cast` 값을 `null`로 설정합니다(Chromecast는 지원되지 않기 때문임).

   ```
   jwplayer(JW_PLAYER_DIV).setup({
      playlist: [{
         file:IVS_STREAM,
         type: 'ivs',
      }]
   });
   ```

1. 기본 Amazon IVS 플레이어에 대한 참조를 사용하여 Amazon IVS 플레이어 API 호출을 수행하거나 콜백 처리를 위해 Amazon IVS 전용 열거형에 대한 참조를 원하는 경우 `'providerPlayer'` 이벤트에 대한 리스너를 추가합니다.

   ```
   jwplayer(JW_PLAYER_DIV).on('providerPlayer', function (player) {
      // player object has 'ivsPlayer' and 'ivsEvents' properties
      // ...callback code...
   });
   ```

### 샘플 코드
<a name="jwplayer-getting-started-code"></a>

이 예에서 `JW_PLAYER_LIB`는 JW 플레이어 라이브러리 스크립트의 URL이고 `IVS_STREAM`은 IVS 재생 URL입니다.

```
<!DOCTYPE html>
<html lang="en">
<head>
   <script src=JW_PLAYER_LIB></script>
   <script src="https://player.live-video.net/1.50.0/amazon-ivs-jw-provider.min.js"></script>
</head>
<body>
   <div id='player'></div>
   <script>
      // set default values for ivsPlayer and ivsEvents
      var ivsPlayer = {};
      var ivsEvents = {};

      // define our player setup
      const ivsConfig = {
         playlist: [{
            file: IVS_STREAM,
            type: 'ivs',
         }]
      };

      jwplayer('player')
         .setup(ivsConfig)
         .on('providerPlayer', function (player) {
            console.log('Amazon IVS Player: ', player.ivsPlayer);
            console.log('Amazon IVS Player Events: ', player.ivsEvents);

            // store the reference to the Amazon IVS Player
            ivsPlayer = player.ivsPlayer;
            // store the reference to the Amazon IVS Player Events
            ivsEvents = player.ivsEvents;
         });
   </script>
</body>
</html>
```

## 이벤트
<a name="jwplayer-events"></a>

표준 JW 플레이어 이벤트를 수신하려면 JW 플레이어의 [on](https://docs.jwplayer.com/players/docs/jw8-reference#event-listening-with-the-jwp-api) 함수를 사용합니다.

Amazon IVS에 특정한 이벤트를 수신하거나 Amazon IVS 웹 플레이어에서 이벤트 리스너를 추가 및 제거하려면 `'providerPlayer'` 이벤트를 수신하여 Amazon IVS 플레이어에 대한 참조를 가져온 다음, 여기에 이벤트 수신을 추가해야 합니다. 예:

```
// store a default value for ivsPlayer
var ivsPlayer = {};

// store references to the Amazon IVS Player and Amazon IVS Events:
jwplayer(JW_PLAYER_DIV).on('providerPlayer', function (player) {
   ivsPlayer = player.ivsPlayer;
});

// set up event listening
ivsPlayer.addEventListener(event, callback);
ivsPlayer.removeEventListener(event, callback);
```

여기서, `callback`은 정의한 콜백이고 `event`는 `PlayerEventType`, `PlayerState` 또는 `ErrorType` 중 하나입니다. 이벤트에 대한 자세한 내용을 알아보려면, [Amazon IVS Player SDK: Web Reference](https://aws.github.io/amazon-ivs-player-docs/1.50.0/web/)에서 확인하세요.

`'providerPlayer'` 이벤트는 JW 플레이어에 의해 생성되며 등록한 콜백은 다음 필드가 있는 객체를 수신합니다.


| 필드 | 설명 | 
| --- | --- | 
|  `ivsPlayer`  |  기본 Amazon IVS 플레이어 인스턴스를 반환합니다. 이 인스턴스를 통해 전체 Amazon IVS 플레이어 웹 API를 사용할 수 있습니다. 가능하면 기본 JW 플레이어 재생 API를 사용하고 Amazon IVS 고유 기능에 액세스하려는 경우에만 이 함수를 사용하는 것이 좋습니다. Amazon IVS 플레이어 인스턴스에서 액세스해야 하는 가장 일반적인 함수는 `removeEventListener()` 및 `addEventListener()`입니다.  | 
|  `ivsEvents`  |  해당 Amazon IVS 고유 열거형에 매핑되는 `PlayerEventType`, `PlayerState` 및 `ErrorType` 필드가 있는 객체를 반환합니다. 자세한 내용은 [Amazon IVS Player SDK: Web Reference](https://aws.github.io/amazon-ivs-player-docs/1.50.0/web/)에서 확인하세요.  | 

## 오류
<a name="jwplayer-errors"></a>

일반적인 JW 플레이어 오류의 경우 JW 플레이어의 [on](https://docs.jwplayer.com/players/docs/jw8-reference#event-listening-with-the-jwp-api) 함수를 사용하여 오류 이벤트를 수신합니다.

Amazon IVS에 특정한 오류의 경우 Amazon IVS 플레이어에서 자체 오류를 수신합니다.

```
// set default values for ivsPlayer and ivsEvents
var ivsPlayer = {};
var ivsEvents = {};

// store references to the Amazon IVS Player and Amazon IVS Events
jwplayer(JW_PLAYER_DIV).on('providerPlayer', function (player) {
   ivsPlayer = player.ivsPlayer;
   ivsEvents = player.ivsEvents;
});

// set up event listening:
let playerEvent = ivsEvents.PlayerEventType;
ivsPlayer.addEventListener(playerEvent.ERROR, callback);
```

콜백은 다음 필드가 있는 객체를 수신합니다.


| 필드 | 설명 | 
| --- | --- | 
|  `type`  |  오류 유형 `ErrorType` 이벤트에 대응합니다. 자세한 내용은 [Amazon IVS Player SDK: Web Reference](https://aws.github.io/amazon-ivs-player-docs/1.50.0/web/)에서 확인하세요.  | 
|  `code`  |  오류 코드입니다.  | 
|  `source`  |  오류 소스입니다.  | 
|  `message`  |  사람이 읽을 수 있는 오류 메시지입니다.  | 

## 콘텐츠 보안 정책
<a name="jwplayer-content-security-policy"></a>

Amazon IVS 공급자 API는 콘텐츠 보안 정책(CSP)을 사용하는 페이지에서 작동하도록 구성되어 있습니다. [IVS Player SDK: 웹 설명서](web-content-security-policy.md)의 '콘텐츠 보안 정책 작업' 섹션을 참조하세요.

## 제한 사항
<a name="jwplayer-limitations"></a>

공급자는 캐스팅을 지원하지 않습니다. JW 플레이어 대시보드에서 캐스팅을 활성화한 경우 `setup()` 호출 시 `cast`를 `null`로 설정하여 비활성화할 수 있습니다. 그러면 캐스팅 버튼을 숨깁니다.