Zenn
🗂

ニコニコ動画埋め込みプレイヤーAPI非公式リファレンス

2023/04/10に公開
ニコニコ動画
tech

5年前の記事しか見当たらなかったので

初期化

<iframe src="http://embed.nicovideo.jp/watch/<動画ID>?jsapi=1&playerId=<内部処理用ID>"></iframe>

動画IDはsm9とかso35384944とかです
※プレ限や有料動画などは表示できません
内部処理用IDは文字列なら何でも大丈夫そうです

イベントの受け取り

window.addEventListener('message', (event) => {
    if (event.origin === 'https://embed.nicovideo.jp') {
        //do something
    }
});

イベントの種類

error

type error = {
    code: string,
    message: string,
    raw: any | undefined
}

削除・非公開

{
    code: "possibly_deleted_video",
    message: "この動画は表示できません\n現在視聴できないか、削除された可能性があります",
    raw: undefined
}

チャンネル動画他

{
    code: "externally_unwatchable",
    message: "",
    raw: undefined
}

loadComplete

type loadComplete = {
    data: {
        videoInfo: {
            commentCount: number,
            description: string,
            lengthInSeconds: number,
            mylistCount: number,
            postedAt: Date,
            thumbnailUrl: string,
            title: string,
            videoId: string,
            viewCount: number,
            watchId: number
        }
    }
    eventName: "loadComplete",
    playerId: string,
    sourceConnectorType: 0
}

playerMetadataChange

type playerMetadataChange = {
    data: {
        currentTime: number,
        duration: number,
        isVideoMetaDataLoaded: boolean,
        maximumBuffered: number,
        muted: boolean,
        showComment: boolean,
        volume: number
    },
    eventName: "playerMetadataChange",
    playerId: string,
    sourceConnectorType: 0
}

playerStatusChange

type playerStatusChange = {
    data: {
        playerStatus: number
    },
    eventName: "playerStatusChange",
    playerId: string,
    sourceConnectorType: 0
}

statusChange

type statusChange = {
    data: {
        playerStatus: number,
        seekStatus: number
    },
    eventName: "statusChange",
    playerId: string,
    sourceConnectorType: 0
}

メゾットの使い方

HTMLIFrameElement.contentWindow.postMessage(message, 'https://embed.nicovideo.jp');

メゾットの種類

commentVisibilityChange

type commentVisibilityChange = {
    eventName: 'commentVisibilityChange',
    data: {
        commentVisibility: boolean
    }
    sourceConnectorType: 1,
    playerId: string
}

incrementViewCount

type incrementViewCount = {
    eventName: 'incrementViewCount',
    sourceConnectorType: 1,
    playerId: string
}

mute

type mute = {
    eventName: 'mute',
    data: {
        mute: boolean
    }
    sourceConnectorType: 1,
    playerId: string
}

pause

type pause = {
    eventName: 'pause',
    sourceConnectorType: 1,
    playerId: string
}

play

type play = {
    eventName: 'play',
    sourceConnectorType: 1,
    playerId: string
}

seek

type seek = {
    eventName: 'seek',
    data: {
        time: number
    }
    sourceConnectorType: 1,
    playerId: string
}

volumeChange

type volumeChange = {
    eventName: 'volumeChange',
    data: {
        volume: number
    }
    sourceConnectorType: 1,
    playerId: string
}

Discussion