템플릿용 SDK

템플릿 개발용 JavaScript SDK

이용 시 주의사항

이용약관을 다시 확인해 주세요

연동 애플리케이션·서비스에도 OneComme의 이용약관이 적용됩니다

크레딧 표기에 대해

HTTP API를 이용한 애플리케이션·서비스를 사용할 때도 무료로 이용하는 경우에는 크레딧 표시가 필요합니다

애플리케이션을 배포할 때는 크레딧 표기에 관한 안내를 반드시 기재하세요

외부 IP나 도메인에서의 접근에 대해

OneComme의 API는 보안상의 이유로 로컬 IP 이외의 접근이 제한되어 있습니다

외부 IP나 도메인에서 API에 접근하려면 "설정 > API 탭"(설정 페이지)에서 접근을 허용할 호스트 이름을 등록해야 합니다

사용법

npm install @onecomme.com/onesdk -S

또는 템플릿 폴더에 있는 preset/__origin/js/onesdk.js를 사용합니다
(http://localhost:11180/templates/preset/__origin/js/onesdk.js 에서도 확인할 수 있습니다)

API

ready():Promise< void >

페이지 로딩이 완료되면 Promise를 resolve합니다
이미 완료된 경우에는 즉시 resolve합니다

setup(config: Partial< OneSDKConfig >): void

SDK의 초기 설정을 진행합니다
이 함수의 호출은 필수입니다

export type Protocol = 'ws' | 'local'  
export interface OneSDKConfig {  
  protocol: Protocol // 접속 프로토콜 (Default: 'local')  
  port: number // 포트 번호 (Default: 11180)  
  host: string // 호스트 이름 (Default: 'localhost')  
  pathname: string // API pathname (Default: '')  
  mode: 'all' | 'diff' // 채팅 가져오기 모드 (Default: 'all') all=최근 가져온 채팅을 매번 전부 가져옴(삭제된 것 제외) diff=항상 최신 것만 가져옴  
  disabledDelay: boolean // 채팅 가져오기 지연을 0으로 설정 (Default: false)  
  intervalTime: number // 채팅 갱신 간격 (Default: 5000)  
  maxQueueInterval: number // 연속된 채팅이 있을 때의 간격 (Default: 150)  
  reconnectInterval: number // 연결이 끊겼을 때의 재접속 간격 (Default: 5000)  
  commentLimit: number // SDK 상에 유지할 최대 채팅 수 (Default: 100)  
  includes: string[] | null // 가져올 방송 플랫폼 (Default: null)  
  excludes: string[] | null // 제외할 방송 플랫폼 (Default: null)  
  includeIds: string[] | null // 수신할 사용자 ID (Default: null)  
  excludeIds: string[] | null // 제외할 사용자 ID (Default: null)  
  includeNames: string[] | null // 가져올 방송 이름 (Default: null)  
  excludeNames: string[] | null // 가져올 방송 이름 (Default: null)  
  lifeTime: number // 채팅 유지 시간 (Default: Infinity)  
  permissions: SendType[] | null // API Permission  
}

subscribe(subscriber: Subscriber): number

OneComme에서 변경이 발생했을 때의 이벤트를 구독합니다
해제에 필요한 구독 ID가 반환됩니다

export type Subscriber = {  
  action: T // permissions에서 지정한 액션 이름  
  callback: (response: PublishActions[T]) => void  
}

unsubscribe(subscriberId: number): void

구독 ID를 기반으로 이벤트 구독을 중지합니다

reset():void

가져온 채팅 등의 데이터를 초기화합니다

getStyleVariable< T = any >(name: string, defaultValue: T, parser: (val:string) => T): T

CSS의 :root에 정의된 CSS 변수 값을 가져오는 함수입니다

getCommentStyle(comment: Comment): {[key: string]: string}

YouTube 등의 슈퍼챗이나 멤버십의 색상 정보를 채팅을 기반으로 반환합니다

export interface Comment {  
  id: string  
  service: ServiceType // 수신한 방송 플랫폼 식별자  
  name: string  
  url: string  
  color: RGBColor // 방송별로 설정한 색상 정보{r,g,b}  
  meta?: BaseCommentMeta  
  data: CommentData  
}  
export interface BaseCommentMeta {  
  no?: number // 채팅 번호  
  tc?: number // 누적 채팅 수  
  lc?: number // 채팅 수  
  interval?: number // 채팅 간격  
  free?: boolean // 무료 기프트 여부  
}  
export interface CommentData {  
  id: string  
  userId: string  
  liveId: string  
  name: string  
  screenName?: string  
  isOwner: boolean  
  isSupporter?: boolean  
  displayName?: string  
  nickname?: string  
  hasGift: boolean  
  autoModerated?: boolean  
  profileImage: string  
  originalProfileImage?: string  
  badges: BaseBadge[]  
  timestamp: string  
  comment: string  
  speechText?: string  
  isFirstTime?: boolean  
  isRepeater?: boolean  
  commentVisible?: boolean  
  meta?: CommentMeta  
}  
export interface BaseBadge {  
  url: string  
  label: string  
  type?: string  
}  
export interface CommentMeta {  
  hasNickname?: boolean  
  hasMemo?: boolean  
  anonymity?: boolean  
  label?: string  
  type?: 'system'  
}

checkLicensed(): Promise< boolean >

PRO 버전을 이용 중인지 여부를 나타내는 플래그를 반환합니다

connect(): Promise< void >

OneComme API 서버에 접속합니다
이 함수의 호출은 필수입니다

getInfo(): Promise< AppInfo >

OneComme 앱의 기본 정보를 반환합니다

export interface AppInfo {  
  platform: 'win' | 'mac'  
  version: string  
  port: number  
  licensed: boolean  
  templatePath: string  
  templateUrl: string  
}

getOrders(): Promise< OrderItem[] >

참여형 순서 대기 정보 목록을 반환합니다

export interface OrderItem {  
  id: string // userid  
  commentId: string  
  service: ServiceType  
  serviceName: string  
  username: string  
  profileImage: string  
  timestamp: string  
  comment: string  
  count: number  
  completed: boolean  
  playing: boolean  
  anonymity: boolean  
  userData?: UserNameData  
  totalCount?: number  
  lastCompletedAt?: string  
}

cancelOrder(orderId: string): Promise< OrderItem[] >

참여 ID를 기반으로 순서 대기를 취소합니다

취소 후 최신 순서 대기 목록이 반환됩니다

completeOrder(orderId: string): Promise< OrderItem[] >

참여 ID를 기반으로 순서 대기를 완료합니다

완료 후 최신 순서 대기 목록이 반환됩니다

getSetList(): Promise< SetListAPIResponse >

[임시 구현] 세트리스트 목록을 반환합니다

export interface SetListAPIResponse {  
  id: number  
  name: string  
  items: MusicData[]  
  completed: MusicData[]  
}  
export interface MusicData {  
  id: number  
  box: number  
  name: string  
  link: string  
  tags: string[]  
  memo: string  
}

Permission

SDK로부터 각종 데이터를 수신하려면 수신할 데이터를 명시해야 합니다

config의 permissions에 배열로 여러 개 지정할 수 있습니다

permissions에 지정한 항목은 subscribe에서 이벤트 타입으로 수신할 수 있게 됩니다