メインコンテンツまでスキップ
Version: 9.0

テンプレート用 SDK

テンプレート開発用のJavaScript SDK

利用上の注意​

注意

本SDKはわんコメテンプレート専用のSDKです
テンプレート・プラグインなどわんコメで使用するものに限り利用できます
わんコメに関係のない使用や公開APIとして使用許可されているAPI以外はご利用頂けません

利用規約を再度ご確認ください​

連携アプリケーション・サービスにもわんコメの利用規約が適用されます

クレジットの表記について​

HTTP APIを利用したアプリケーション・サービスを使用する際にも無料利用の場合はクレジット表示が必要となります

アプリケーションを配布する際はクレジット表記に関する注釈を必ず記入してください

外部IPやドメインからの参照について​

わんコメのAPIは安全上の理由からローカルIP以外でのアクセスに制限があります

外部IPやドメインからAPIへアクセスするためには「設定 > APIタブ」（設定ページ）にてアクセス許可するホスト名の登録が必要です

注意

APIドキュメントは一部不完全です
Discrodサーバーの開発者専用チャンネルにて追加や最新情報をやり取りしています
開発者の方はぜひDiscordに参加して開発者であることをお知らせください

使い方​

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の初期設定を行います
この関数の呼び出しは必須です

configPartial< OneSDKConfig >
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​

わんコメで変更があった際のイベントを購読します
解除に必要な購読IDが返却されます

subscriberSubscriber
export type Subscriber = {  
  action: T // permissionsで指定したアクション名  
  callback: (response: PublishActions[T]) => void  
}

unsubscribe(subscriberId: number): void​

購読IDをもとにイベントの購読を停止します

subscriberIdnumber

reset():void​

取得したコメント等のデータを初期化します

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

CSSの:rootに定義されたCSS変数の値を取得する関数です

namestring
defaultValueT
parser(val: string) ⇒ T

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

YouTube等のスパチャやメンバーシップの色情報をコメントをもとに返却します

commentComment
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 >​

わんコメAPIサーバーに接続します
この関数の呼び出しは必須です

getInfo(): Promise< AppInfo >​

わんコメアプリの基本情報を返却します

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

getOrders(): Promise< OrderItem[] >​

参加型の順番待ち情報一覧を返却します

OrderItem[]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をもとに順番待ちをキャンセルします

キャンセル後の最新の順番待ちリストが返却されます

OrderItem[]OrderItem[]

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

参加IDをもとに順番待ちを完了します

完了後の最新の順番待ちリストが返却されます

OrderItem[]OrderItem[]

getSetList(): Promise< SetListAPIResponse >​

【仮実装】セットリスト一覧を返却します

SetListAPIResponseSetListAPIResponse
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でイベントタイプとして受信可能となります

connected接続が正常に行われたとき
comments通常のコメントを受信したとき
systemCommentシステムコメントを受信したとき
clearコメントクリアを実行したとき
deletedコメントが削除されたとき
meta配信情報が更新されたとき
meta.clear配信情報がクリアされたとき
notification通知を受信したとき
pinnedコメントのピン留めが変化したとき
waitingList参加待ちリストが変化したとき
setListセットリストが変化したとき
setList.requestリクエストが変化したとき