Skip to content

B站直播间 WebSocket 代理服务,可用于实时获取直播间弹幕 (非官方SDK,无需鉴权等繁琐操作)

License

Notifications You must be signed in to change notification settings

champkeh/blive-ws

Repository files navigation

blive-ws

B站直播间 WebSocket 代理服务,可用于实时获取直播间弹幕相关数据。

关于这个代理服务,可查看 websocket重构 了解更多细节。

演示地址: https://blive.deno.dev

⚠️⚠️⚠️

上面这个演示地址采用的是 公共代理 服务,这个服务是部署在免费的 Deno Deploy 上面的,稳定性不能保证,仅用于演示的目的

如果需要使用,请 自行部署

使用效果

部署指南

目前仅支持部署到 Deno Deploy,请自行注册账号。如果需要部署到其他平台,欢迎PR。

部署到 Deno Deploy

1. fork本仓库

2. 在 Deploy 上创建项目

选择 Deploy an existing GitHub repository,如下图所示: 部署第一步

3. 项目配置 & 部署

选择刚 fork 的仓库及分支,构建模式选择 Github Action,然后点击 Add Build Step,如下图所示: 部署第二步

4. 获取代理地址

恭喜你,到这一步,就已经部署成功了。

切换到 设置 选项卡下面获取 ws 地址,如下图所示,ws 地址为:wss://bright-coyote-40.deno.dev

部署第三步

使用指南

通过在服务端部署一个 websocket 代理服务器,这个代理服务器与B站的弹幕服务器进行通信并封装了繁琐的通信细节及服务轮训过程,前端只需要连接到这个代理服务器,然后通过几条简单的指令即可开启实时弹幕接收了。

下面的示例是浏览器 js 代码,其他环境类似,都是通过 websocket 客户端连接到这个代理服务器,然后发送指令。

目前的公共代理服务器地址为: wss://blive.deno.dev

// 连接到代理服务器
const socket = new WebSocket('wss://blive.deno.dev')

socket.addEventListener('open', () => {
    // 进入房间命令
    socket.send(JSON.stringify({
        cmd: 'enter',           // 命令名,必填
        rid: 123,               // 房间号,必填
        events: ['DANMU_MSG'],  // 监听这个房间中的事件列表,必填
    }))

    // 退出房间命令
    socket.send(JSON.stringify({
        cmd: 'leave',           // 命令名,必填
        rid: 123,               // 房间号,必填
    }))
    
    // 退出所有房间
    socket.send(JSON.stringify({
        cmd: 'exit',
    }))
})

// 接收进入房间时`events`参数所指定的消息
socket.addEventListener('message', ({data}) => {
    // 接收到的消息,格式为 { rid: 房间号, payload: {} }
    console.log(data)
})

更详细的例子,请查看 Example (JS版)

支持的命令 cmd

  • enter: 进入房间,需要传 rid 和 events 参数
  • leave: 退出房间,需要传 rid 参数
  • exit: 退出所有房间

支持的监听事件 event

注:本人不怎么玩直播,所以下面的事件名字都是根据英文单词直译的,可能跟大家在直播间使用的术语不一样。

事件名(大小写敏感) 说明
COMMON_NOTICE_DANMAKU 公共通知
NOTICE_MSG 任务通知
STOP_LIVE_ROOM_LIST 停播直播间列表
HOT_RANK_CHANGED 热榜更新
HOT_RANK_CHANGED_V2 热榜更新
HOT_RANK_SETTLEMENT_V2 热榜结算
DANMU_MSG 普通弹幕
DANMU_AGGREGATION 聚合弹幕
SUPER_CHAT_MESSAGE 超级聊天消息
SUPER_CHAT_MESSAGE_JPN 超级聊天消息
ROOM_REAL_TIME_MESSAGE_UPDATE 直播间实时信息更新
INTERACT_WORD 直播间互动文字
WATCHED_CHANGE 直播间观看人数更新
ONLINE_RANK_V2 直播间高能用户排名
ONLINE_RANK_COUNT 直播间高能用户数
ONLINE_RANK_TOP3 直播间Top3高能用户
ENTRY_EFFECT 进入特效
GUARD_BUY 购买舰长
SEND_GIFT 送礼物
COMBO_SEND 连送礼物
LIVE 开始直播
PREPARING 准备中
PK_BATTLE_PRE_NEW PK
WIDGET_BANNER 小部件
LIVE_INTERACTIVE_GAME 现场交互游戏(弹幕?)

使用注意事项

/**
 * 数据流转图示:
 *               1                          2
 * 客户端(you)   <==>   代理服务器(本服务器)   <==>   B站弹幕服务器
 *
 */

由于 ws 连接需要保活,所以需要心跳机制,该机制通常是通过 ping/pong 帧实现的, 但是由于 ws 库的原因,无法发送这两个数据包,所以代理服务器会每隔30秒给客户端 发送一个 ping 字符串作为 ping 帧,客户端不再需要自己发送 ping 帧来 保活,但是需要处理这个 ping 消息。

比如,如果JSON解析失败则忽略之(因为正常的消息都是JSON字符串):

ws.onmessage = (event) => {
    let data
    try {
        data = JSON.parse(event.data)
    } catch (e) {
        return
    }
    
    // 后续的处理
}

目录说明

下面是本项目各个目录的说明:

  • anatomy: 对B站压缩版js进行还原,也可能会把一些文件拆成多个文件方便分析
  • docs: 项目文档及一些收集到的B站网页调用的接口
  • examples: 使用示例
  • raw: 从B站获取的压缩版js文件(原始未修改)
  • src/deno: 部署到 Deno Deploy 的代理服务器
  • test: 测试文件

通讯协议细节

B站直播间数据传输协议细节

浏览器端的最小实现

以下代码可直接复制到浏览器控制台执行。

function now() {
    return new Intl.DateTimeFormat('zh-CN', {
        dateStyle: 'short',
        timeStyle: 'medium',
        timeZone: 'Asia/Shanghai'
    }).format(new Date())
}

const encoder = new TextEncoder()
const decoder = new TextDecoder()

function mergeArrayBuffer(buf1, buf2) {
    const b1 = new Uint8Array(buf1)
    const b2 = new Uint8Array(buf2)
    const buf = new Uint8Array(b1.byteLength + b2.byteLength)
    buf.set(b1, 0)
    buf.set(b2, b1.byteLength)
    return buf.buffer
}
function convertToArrayBuffer(payload, op) {
    const header = new ArrayBuffer(16)
    const dataView = new DataView(header, 0)
    const body = encoder.encode(payload)

    dataView.setInt32(0, 16 + body.byteLength)
    dataView.setInt16(4, 16)
    dataView.setInt16(6, 1)
    dataView.setInt32(8, op)
    dataView.setInt32(12, 1)
    return mergeArrayBuffer(header, body)
}
function parseArrayBuffer(buffer) {
    const packets = []
    let pos = 0

    while (pos < buffer.byteLength) {
        const headerBuf = buffer.slice(pos, pos + 16)
        const headerView = new DataView(headerBuf)
        const packetSize = headerView.getInt32(0)
        const headerSize = headerView.getInt16(4)
        const protoVer = headerView.getInt16(6)
        const op = headerView.getInt32(8)
        const seq = headerView.getInt32(12)

        const body = buffer.slice(pos + 16, pos + packetSize)
        pos += packetSize

        let decode = null
        if (protoVer === 0 || protoVer === 1) {
            // 无压缩
            if (op === 3) {
                // 心跳应答包,body不是json格式
                const count = new DataView(body).getInt32(0)
                decode = {count}
            } else {
                decode = JSON.parse(decoder.decode(body))
            }
        } else if (protoVer === 2) {
            // gzip 压缩
            throw new Error('暂未提供gzip解压缩处理,请联系开发者(champkeh)。')
        } else if (protoVer === 3) {
            // brotli 压缩
            const rawPacket = window.BrotliDecode(new Uint8Array(body))
            const innerPackets = parseArrayBuffer(rawPacket.buffer)
            packets.push(...innerPackets)
            continue
        }

        packets.push({
            packetSize,
            headerSize,
            protoVer,
            op,
            seq,
            body: decode,
        })
    }

    return packets
}

function getDanmuInfo(roomid) {
    return fetch(`https://api.live.bilibili.com/xlive/web-room/v1/index/getDanmuInfo?id=${roomid}&type=0`).then(resp => resp.json())
}

let HEART_BEAT_INTERVAL
let ws
function heartBeat() {
    clearTimeout(HEART_BEAT_INTERVAL)

    ws.send(convertToArrayBuffer('', 2))

    HEART_BEAT_INTERVAL = setTimeout(() => {
        heartBeat()
    }, 30 * 1000)
}

function connectWebSocket(roomid, host, key) {
    const url = `wss://${host.host}/sub`
    const socket = new WebSocket(url)
    socket.binaryType = 'arraybuffer'
    socket.onopen = () => {
        const auth = {
            uid: 0,
            roomid: roomid,
            protover: 3,
            buvid: '',
            platform: 'web',
            type: 2,
            key: key,
        }
        socket.send(convertToArrayBuffer(JSON.stringify(auth), 7))
        ws = socket
    }
    socket.onmessage = (event) => {
        try {
            const packets = parseArrayBuffer(event.data)
            for (const packet of packets) {

                switch (packet.op) {
                    // 心跳应答: 3
                    case 3:
                        break

                    // 普通消息: 5
                    case 5:
                        if (packet.body.cmd === 'DANMU_MSG') {
                            const info = {
                                uid: packet.body.info[2][0],
                                uname: packet.body.info[2][1],
                                text: packet.body.info[1],
                            }
                            console.log(`[${now()}] ${info.uname}(${info.uid}): ${info.text}`)
                        }
                        break

                    // 认证结果: 8
                    case 8:
                        switch (packet.body.code) {
                            // 认证成功: 0
                            case 0:
                                heartBeat()
                                break

                            // 认证失败: -101
                            case -101:
                                console.error('认证失败')
                                break
                        }
                }
            }
        } catch (e) {
            console.error("[ws] 解析 packet 失败", e)
        }
    }
    socket.onerror = (event) => {
        console.log('error: ', event)
    }
    socket.onclose = (event) => {
        console.log('close: ', event.code, event.reason)
        clearTimeout(HEART_BEAT_INTERVAL)
    }
}

function start(roomid) {
    getDanmuInfo(roomid).then(resp => {
        const {code, data, message} = resp
        if (code === 0) {
            connectWebSocket(roomid, data.host_list[0], data.token)
        } else {
            console.error(message)
        }
    })
}


// 加载 BrotliDecode 解码器
const scriptElement = document.createElement("script")
scriptElement.src = "//activity.hdslb.com/blackboard/static/20210425/d0411babbbf77c49ca42a3320eb804ae/0NCT06vruR.js"
scriptElement.onload = () => {
    // 开始监听直播间,这个id必须是真实id,不支持短id
    start(7734200)
}
window.document.head.append(scriptElement)

FAQ

1. 为什么会有这个项目?

周末在家刷B站时,偶尔看到B站直播间可以用弹幕玩游戏,根据用户输入的弹幕内容与其他玩家进行实时游戏,感觉挺新颖的,于是就想研究一下是怎么实现的。

网上大概搜了一下,B站没有提供实时获取直播间弹幕的 API(B站提供了开放直播相关的sdk,不过需要繁琐的鉴权过程,于是放弃),网上有使用爬虫实现的,但作为一枚前端,首先想到的就是看看能不能直接连接B站的 websocket 弹幕服务器,直接接收弹幕消息。

想法有了,于是就开干吧。整个过程其实就是把B站的直播间相关js代码拉下来,然后将压缩版的js代码还原成接近源码的程度,弄清楚整个 websocket 是如何通信的。

这个过程其实没那么难,只是需要花一些时间。利用周末2天时间,基本上把弹幕的接收端调通了,可以实时接收直播间的弹幕消息。

目前遇到的难点可能就是 await 代码不太好还原成源码,基本只能靠猜。因为 await 编译之后变成了 generator 的实现,中间的逻辑我还没分析出来。

不过,单靠猜基本也能还原个八九不离十。

感兴趣的可以查看下 anatomy/await/ 目录下关于__awaiter/__generator函数的实现。

2. 与官方 sdk 相比,有什么优缺点?

说实话,在开始这个项目之前我是不知道(也没有想到,的确是我考虑不足)有官方 sdk 的。 后面发现官方提供了直播相关的开放平台(https://open-live.bilibili.com/document/), 不过对接这个sdk需要繁琐的鉴权过程,如果只需要获取弹幕数据的话,可以直接使用本工具。(后续会研究一下官方sdk的其他功能)

优点:

  • 使用简单

缺点:

  • 等我研究完官方sdk后进行说明(但很明显的缺点就是功能单一,无法与其他直播间相关功能进行整合)

3. 与其他类似开源项目相比,有什么优缺点?

首先,最大的优点就是 语言无关,也就是说,不管是浏览器、node、Java 还是 python,都可以使用本项目(毕竟它只是一个服务而已)。另外,使用简单 也是它的另一个优点。

缺点的话,首先是 需要服务器 进行部署,但好在有一些免费的服务器可以使用,所以这一点并不算很严重的缺点。 另一个缺点可能有 速度上的劣势,毕竟中间多了一层服务转发,这个跟服务器的位置及流量、性能等有关,具体会多出来多少延迟我没有统计过。

类似项目

TODO

近期要实现的功能:

  • 添加稳定性测试
  • 记录关键日志数据到数据库,方便性能及bug分析
  • 重构数据结构,优化内存开销

LICENSE

MIT

About

B站直播间 WebSocket 代理服务,可用于实时获取直播间弹幕 (非官方SDK,无需鉴权等繁琐操作)

Topics

Resources

License

Stars

Watchers

Forks

Languages