Skip to content

tiajinsha/JKVideo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

21d9df0 · Mar 20, 2026

History

102 Commits
Mar 10, 2026
Mar 20, 2026
Mar 12, 2026
Mar 20, 2026
Mar 5, 2026
Mar 19, 2026
Mar 20, 2026
Mar 20, 2026
Mar 20, 2026
Mar 19, 2026
Mar 19, 2026
Mar 19, 2026
Mar 20, 2026
Mar 5, 2026
Mar 20, 2026
Mar 20, 2026
Mar 20, 2026
Mar 20, 2026
Mar 20, 2026
Mar 20, 2026
Mar 20, 2026
Mar 17, 2026
Mar 5, 2026
Mar 20, 2026
Mar 20, 2026
Mar 10, 2026
Mar 5, 2026

Repository files navigation

JKVideo

JKVideo

高颜值第三方 B 站 React Native 客户端

A feature-rich Bilibili-like app with DASH playback, real-time danmaku, WBI signing & live streaming


React Native Expo TypeScript License: MIT Platform

English · 快速开始 · 功能亮点 · 贡献


截图预览


首页热门 · 内联视频 · 穿插直播

视频详情 · 简介 · 推荐视频

竖屏播放 · 4K HDR · 多清晰度

下载管理 · 局域网分享二维码

直播 Tab · 关注主播在线 · 分区筛选

直播详情 · 实时弹幕 · 舰长标记

演示视频

https://github.com/tiajinsha/JKVideo/releases/download/v1.0.0/6490dcd9dba9a243a7cd8f00359cc285.mp4


功能亮点

🎬 DASH 完整播放 Bilibili DASH 流 → buildDashMpdUri() 生成本地 MPD → ExoPlayer 原生解码,支持 1080P+ 4K HDR

💬 完整弹幕系统 视频弹幕 XML 时间轴同步 + 5 车道飘屏覆盖;直播弹幕 WebSocket 实时接收 + 舰长标记 + 礼物计数

🔐 WBI 签名实现 纯 TypeScript 手写 MD5,无任何外部加密依赖,nav 接口 12h 自动缓存

🏠 智能首页排布 BigVideoCard 内联 DASH 静音自动播放 + 水平手势快进 + 直播卡片穿插 + 双列混排

📺 全局迷你播放器 切换页面后底部浮层续播,VideoStore 跨组件状态同步

🔑 扫码登录 二维码生成 + 2s 轮询 + 响应头 Cookie 自动提取 SESSDATA

📥 下载 + 局域网分享 多清晰度后台下载,内置 HTTP 服务器生成局域网 QR 码,同 Wi-Fi 设备扫码直接播放

🌐 跨平台运行 Android · iOS · Web,Expo Go 扫码 5 分钟运行,Dev Build 解锁完整 DASH 播放


技术架构

技术
框架 React Native 0.83 + Expo SDK 55
路由 expo-router v4(文件系统路由,Stack 导航)
状态管理 Zustand
网络请求 Axios
本地存储 @react-native-async-storage/async-storage
视频播放 react-native-video(DASH MPD / HLS / MP4)
降级播放 react-native-webview(HTML5 video 注入)
页面滑动 react-native-pager-view
图标 @expo/vector-icons(Ionicons)

快速开始

方式一:Expo Go(5 分钟,无需编译)

部分清晰度受限,视频播放降级为 WebView 方案

git clone https://github.com/tiajinsha/JKVideo.git
cd JKVideo
npm install
npx expo start

用 Expo Go App(Android / iOS)扫描终端二维码即可运行。

方式二:Dev Build(完整功能,推荐)

支持 DASH 1080P+ 原生播放、完整弹幕系统

npm install
npx expo run:android   # Android
npx expo run:ios       # iOS(需 macOS + Xcode)

方式三:Web 端

npm install
npx expo start --web

Web 端图片需本地代理服务器绕过防盗链:node scripts/proxy.js(端口 3001)

直接安装(Android)

前往 Releases 下载最新 APK,无需编译,安装即用。

需在 Android 设置中开启「安装未知来源应用」


项目结构

app/
  index.tsx            # 首页(PagerView 热门/直播 Tab)
  video/[bvid].tsx     # 视频详情(播放 + 简介/评论/弹幕)
  live/[roomId].tsx    # 直播详情(HLS 播放 + 实时弹幕)
  search.tsx           # 搜索页
  downloads.tsx        # 下载管理页
  settings.tsx         # 设置页(画质 + 退出登录)

components/            # UI 组件(播放器、弹幕、卡片等)
hooks/                 # 数据 Hooks(视频列表、播放流、弹幕等)
services/              # Bilibili API 封装(axios + Cookie 拦截)
store/                 # Zustand 状态(登录、下载、播放、设置)
utils/                 # 工具函数(格式化、图片代理、MPD 构建)

已知限制

限制 原因
4K / 1080P+ 需要大会员账号登录 B 站 API 策略限制
FLV 直播流不支持 HTML5 / ExoPlayer 均不支持 FLV,已自动选 HLS
Web 端需本地代理 B 站图片防盗链(Referer 限制)
动态流 / 投稿 / 点赞 需要 bili_jct CSRF Token,暂未实现
二维码 10 分钟过期 关闭登录弹窗重新打开即可刷新

贡献

欢迎提交 Issue 和 PR!请先阅读 CONTRIBUTING.md


免责声明

本项目仅供个人学习研究使用,不得用于商业用途。 所有视频内容版权归原作者及哔哩哔哩所有。 本项目与哔哩哔哩官方无任何关联。


License

MIT © 2026 JKVideo Contributors


如果这个项目对你有帮助,欢迎点一个 ⭐ Star!


请作者喝杯咖啡 ☕

如果这个项目对你有所帮助,欢迎请作者喝杯咖啡,你的支持是持续开发的最大动力,感谢每一位愿意打赏的朋友!


微信支付

支付宝