Version: 5.3

릴리스 노트

WebPlanetKit 5.3의 릴리스 노트입니다.

WebPlanetKit 5.3

릴리스 일자: 2024-12-23

`MediaStreamManager` 추가

미디어 장치를 사용해 MediaStream을 쉽게 생성하고 관리할 수 있는 MediaStreamManager 클래스를 추가했습니다.
생성한 MediaStreamManager 인스턴스는 MakeCallParams이나 VerifyCallParams, ConferenceParams, EnableVideoOptions에 쉽게 적용할 수 있고, 이를 통해 WebPlanetKit과 원활히 상호작용할 수 있습니다.

API

추가

MediaStreamManager class 1-to-1 callGroup call
MakeCallParams data class 1-to-1 call
- var mediaStreamManager?: MediaStreamManager
VerifyCallParams data class 1-to-1 call
- var mediaStreamManager?: MediaStreamManager
ConferenceParams data class Group call
- var mediaStreamManager?: MediaStreamManager
EnableVideoOptions data class 1-to-1 callGroup call
- var mediaStreamManager?: MediaStreamManager

예제 코드

MediaStreamManager 사용 예제

// Init MediaStreamManager
import { MediaStreamManager } from "@line/planetKit";

const mediaStreamManager = new MediaStreamManager();

// Getting default media device ID
const audioInputDevices = mediaStreamManager.getAudioInputDevices();
const defaultAudioInputDeviceId = audioInputDevices[0].deviceId;

const videoInputDevices = mediaStreamManager.getVideoInputDevices();
const defaultVideoInputDeviceId = videoInputDevices[0].deviceId;

// Create media stream with param
const mediaStreamParam = {
  audioInputDeviceId: defaultAudioInputDeviceId,
  videoInputDeviceId: defaultVideoInputDeviceId,
};
const mediaStream = await mediaStreamManager.createMediaStream(mediaStreamParam);

// Apply to WebPlanetKit
const conferenceParams = {
    ...,
    mediaStreamManager: mediaStreamManager
}
planetKit.joinConference(conferenceParams);

더 많은 API를 확인하려면 API 레퍼런스를 참고하세요.

가상 배경 기능 추가

WebPlanetKit의 가상 배경 기능을 지원하기 위한 planet-kit-virtual-background 플러그인을 추가했습니다. WebPlanetKit에 가상 배경 기능을 적용하려면 이 플러그인을 다운로드해야 합니다.
가상 배경 기능을 이용하면 비디오 스트림의 배경에서 사람을 감지하고 분리한 뒤 배경을 흐리게 만들거나 이미지로 대체하는 등의 효과를 적용할 수 있습니다.
Safari 브라우저에서는 가상 배경 기능을 지원하지 않습니다.

API

추가

Call class 1-to-1 call
- function registerVirtualBackground(virtualBackground: VirtualBackground)
- function startVirtualBackgroundBlur(canvasElement?: HTMLCanvasElement, blurRadius?: number)
- function startVirtualBackgroundImage(canvasElement: HTMLCanvasElement, image: HTMLImageElement|ImageBitmap)
- function stopVirtualBackground()
- function getVirtualBackgroundVideoStream(frameRate?: number)
- function changeVirtualBackgroundVideoElement(videoElement: HTMLVideoElement)
- function changeVirtualBackgroundCanvasElement(canvasElement: HTMLCanvasElement)
- function isVirtualBackgroundActive()
Conference class Group call
- function registerVirtualBackground(virtualBackground: VirtualBackground)
- function startVirtualBackgroundBlur(canvasElement?: HTMLCanvasElement, blurRadius?: number)
- function startVirtualBackgroundImage(canvasElement: HTMLCanvasElement, image: HTMLImageElement|ImageBitmap)
- function stopVirtualBackground()
- function getVirtualBackgroundVideoStream(frameRate?: number)
- function changeVirtualBackgroundVideoElement(videoElement: HTMLVideoElement)
- function changeVirtualBackgroundCanvasElement(canvasElement: HTMLCanvasElement)
- function isVirtualBackgroundActive()
MediaStreamManager class 1-to-1 callGroup call
- function registerVirtualBackground(virtualBackground: VirtualBackground)
- function startVirtualBackgroundBlur(canvasElement?: HTMLCanvasElement, blurRadius?: number)
- function startVirtualBackgroundImage(canvasElement: HTMLCanvasElement, image: HTMLImageElement|ImageBitmap)
- function stopVirtualBackground()
- function getVirtualBackgroundVideoStream(frameRate?: number)
- function changeVirtualBackgroundVideoElement(videoElement: HTMLVideoElement)
- function changeVirtualBackgroundCanvasElement(canvasElement: HTMLCanvasElement)
- function isVirtualBackgroundActive()

가상 배경 기능 사용 방법

예제: `planet-kit` 설정하기

// Import SDK
import { Conference } from "@line/planet-kit";
import PlanetKitVirtualBackground from "@line/planet-kit-virtual-background";

// Create a planet-kit instance (This example is for group call).
const planetKit = new Conference();

// Create a planet-kit-virtual-background instance.
const virtualBackground = new PlanetKitVirtualBackground();

// Register the planet-kit-virtual-background with the planet-kit.
const conferenceParams = {...};
planetKit.joinConference(conferenceParams).then(() => {
  planetKit.registerVirtualBackground(virtualBackground);
});

PlanetKit에 PlanetKitVirtualBackground를 등록하면 가상 배경 기능을 사용할 수 있습니다. 가상 배경과 관련된 더 많은 예제와 API는 planet-kit-virtual-background와 API 레퍼런스를 참고하세요.

통화 시도 함수의 오류 처리 방법 개선

Planet Cloud에 대한 통화 시도 중 오류 발생 시 왜 오류가 발생했는지 자세한 이유를 제공하기 위해 StartFailReason을 추가했습니다.
이제 통화 시도 함수(makeCall, verifyCall, joinConference)에서 구조화된 오류 객체를 통해 자세한 오류 발생 이유를 제공합니다.

API

추가

START_FAIL_REASON enum 1-to-1 callGroup call
MakeCallError data class 1-to-1 call
VerifyCallError data class 1-to-1 call
JoinConferenceError data class Group call

삭제

KIT_DISCONNECT_REASON enum 1-to-1 callGroup call
- PLANETKIT_DISCONNECT_REASON_WEB_BROWSER_NOT_SUPPORTED: 1612

변경

반환 값 유형 변경

이전 버전	WebPlanetKit 5.3	비고
`function makeCall(params)`	`function makeCall(params): Promise` `throws {MakeCallError}`	1대1 통화
`function verifyCall(params)`	`function verifyCall(params): Promise` `throws {VerifyCallError}`	1대1 통화
`function joinConference(params)`	`function joinConference(params): Promise` `throws {JoinConferenceError}`	그룹 통화

통화음 기능 추가

통화음 기능을 추가했습니다. 통화음의 URL을 설정하면 WebPlanetKit이 적절한 시점에 해당 통화음을 재생합니다.

API

추가

MakeCallParams data class 1-to-1 call
- var ringbackToneUrl?: string
- var endToneUrl?: string
- var playEndToneRegardlessOfCallState?: boolean
VerifyCallParams data class 1-to-1 call
- var ringToneUrl?: string
- var endToneUrl?: string
- var playEndToneRegardlessOfCallState?: boolean
ConferenceParams data class Group call
- var endToneUrl?: string
- var playEndToneRegardlessOfCallState?: boolean

디버그 알림 기능 추가

사용자에게 내부 경고 상황이나 디버그 정보를 제공하기 위한 디버그 알림 기능을 추가했습니다.
이전에 evtInnerLog를 통해 전달하던 모든 이벤트를 KitDelegate의 evtDebugNotice 이벤트로 전환했습니다.

API

추가

DEBUG_NOTICE enum 1-to-1 callGroup call
KitDelegate protocol 1-to-1 callGroup call
InitConfig data class 1-to-1 callGroup call
- var delegate?: KitDelegate

삭제

MakeCallDelegate protocol 1-to-1 call
- evtInnerLog(innerLogObject: InnerLogObject)
VerifyCallDelegate protocol 1-to-1 call
- evtInnerLog(innerLogObject: InnerLogObject)
ConferenceDelegate protocol Group call
- evtInnerLog(innerLogObject: InnerLogObject)
InnerLogObject data class 1-to-1 callGroup call
INNER_LOG_NAME enum 1-to-1 callGroup call

예제 코드

const planetKit = new Conference({
  ...,
  delegate: {
    evtDebugNotice: (debugNoticeParam) => {},
  },
});

앱 서버 데이터 사양 변경

앱 서버 데이터의 최댓값을 256바이트에서 4096바이트로 변경했습니다.
앱 서버 데이터의 최댓값을 초과할 경우 START_FAIL_REASON.TOO_LONG_APP_SERVER_DATA와 함께 통화에 실패합니다.

`displayName` 사양 변경

displayName은 null 종료 문자를 포함해 128바이트로 제한됩니다.
최대 크기를 초과하는 문자열의 나머지 부분은 버려집니다.

커스텀 미디어 스트림 설정 기능 추가

initMedia 옵션이나 video modifier API를 대체하는 더욱 직관적이고 사용자 친화적인 커스텀 미디어 스트림 설정 API를 추가했습니다.

API

추가

Call class 1-to-1 call
- function setCustomMediaStream(mediaStream: MediaStream)
- function unsetCustomMediaStream()
- function hasSetCustomMediaStreamWithAudio()
- function hasSetCustomMediaStreamWithVideo()
Conference class Group call
- function setCustomMediaStream(mediaStream: MediaStream)
- function unsetCustomMediaStream()
- function hasSetCustomMediaStreamWithAudio()
- function hasSetCustomMediaStreamWithVideo()
MakeCallParams data class 1-to-1 call
- var customMediaStream?: MediaStream
VerifyCallParams data class 1-to-1 call
- var customMediaStream?: MediaStream
ConferenceParams data class Group call
- var customMediaStream?: MediaStream
EnableVideoOptions data class 1-to-1 callGroup call
- var customMediaStream?: MediaStream

삭제

Call class 1-to-1 call
- function setVideoModifier(canvasElement: HTMLCanvasElement)
- function resetVideoModifier()
Conference class Group call
- function setVideoModifier(canvasElement: HTMLCanvasElement)
- function resetVideoModifier()
MakeCallParams data class 1-to-1 call
- var initMedia?: InitMedia
VerifyCallParams data class 1-to-1 call
- var initMedia?: InitMedia
ConferenceParams data class Group call
- var initMedia?: InitMedia
EnableVideoOptions data class 1-to-1 callGroup call
- var initMedia?: InitMedia

1대1 통화에 뷰 변경 API 추가

1대1 통화에 UI 개발 편의성을 높이기 위한 뷰 변경 API를 추가했습니다.

API

추가

Call class 1-to-1 call
- function getMyMediaStream()
- function changeMyView(videoElement: HTMLVideoElement, cleanOldElement?: boolean)
- function changePeerView(videoElement: HTMLVideoElement, cleanOldElement?: boolean)

WebPlanetKit 5.3​

MediaStreamManager 추가​

API​

추가​

예제 코드​

가상 배경 기능 추가​

API​

추가​

가상 배경 기능 사용 방법​

예제: planet-kit 설정하기​

통화 시도 함수의 오류 처리 방법 개선​

API​

추가​

삭제​

변경​

통화음 기능 추가​

API​

추가​

디버그 알림 기능 추가​

API​

추가​

삭제​

예제 코드​

앱 서버 데이터 사양 변경​

displayName 사양 변경​

커스텀 미디어 스트림 설정 기능 추가​

API​

추가​

삭제​

1대1 통화에 뷰 변경 API 추가​

API​

추가​

WebPlanetKit 5.3

`MediaStreamManager` 추가

API

추가

예제 코드

가상 배경 기능 추가

API

추가

가상 배경 기능 사용 방법

예제: `planet-kit` 설정하기

통화 시도 함수의 오류 처리 방법 개선

API

추가

삭제

변경

통화음 기능 추가

API

추가

디버그 알림 기능 추가

API

추가

삭제

예제 코드

앱 서버 데이터 사양 변경

`displayName` 사양 변경

커스텀 미디어 스트림 설정 기능 추가

API

추가

삭제

1대1 통화에 뷰 변경 API 추가

API

추가