Files
moeplayer/README.md
T
王阳 f4360c3a17 阶段6:发布收尾 v0.1.0
- LICENSE 更新为 MoePlayer+niandeng 双版权,修正 moeplayer/LICENSE 误置的 Apache 2.0
- 新增 CHANGELOG.md
- package.json 补全 author/repository/homepage/keywords
- README 更新路线图进度与插件仓库链接
2026-07-21 19:24:13 +08:00

3.3 KiB
Raw Permalink Blame History

MoePlayer

一款中文友好的开源网页视频播放器(MIT 协议),fork 自已停止维护的 ckplayer X3,在其基础上持续现代化改造。

本项目处于活跃改造期,API 与 ckplayer X3 基本兼容,但全局变量已更名为 MoePlayerCSS 类名前缀已更名为 moeplayer-*

特性

  • 支持 mp4 / flv / m3u8 / ts 等格式(m3u8 基于 hls.jsflv/ts 基于 mpegts.js
  • 无需指定插件,按 URL 扩展名自动识别 m3u8 / flv / ts(m2ts)iOS 上 m3u8 自动走原生 HLS
  • 支持点播、直播、直播+回放
  • 支持 PC 与移动端 H5
  • 支持使用 JS 监听播放器各种状态、控制播放器各种操作
  • 零框架依赖,引入一个 JS 和一个 CSS 即可使用
  • 多实例友好:同一页面可创建多个播放器

快速开始

moeplayer 文件夹上传到网站环境中,在页面引入 moeplayer.jsmoeplayer.css

<link type="text/css" rel="stylesheet" href="moeplayer/css/moeplayer.css" />
<script type="text/javascript" src="moeplayer/js/moeplayer.min.js" charset="UTF-8"></script>
<div class="video" style="width: 600px;height: 400px;">播放器容器</div>
<script type="text/javascript">
    var videoObject = {
        container: '.video', //“#”代表容器的ID,“.”或“”代表容器的class
        video: 'https://example.com/sample.mp4' //视频地址
    };
    var player = new MoePlayer(videoObject); //初始化播放器
</script>

更多配置与 API 可参考本仓库的 index.html 演示页;原 ckplayer 手册(http://www.ckplayer.com/manual/ )在改造期内仍有参考价值。

语言

默认中文。引入语言包可切换其它语言(需在引入 moeplayer.js 之前引入):

<script type="text/javascript" src="moeplayer/language/en.js" charset="UTF-8"></script>

皮肤

默认皮肤 moeplayer.css,另有红色 moeplayer.red.css、西瓜风格 moeplayer.ixigua.css,替换 CSS 文件即可换肤。

从源码构建

npm install
npm run build

源码在 src/(ES Module),构建产物输出到 moeplayer/js/(UMD,含未压缩版与 min 版),同时从 npm 依赖拷贝 hls.js / mpegts.js 运行时库到 moeplayer/ 对应目录。

改造路线图

  • 工程化:npm + rollup 构建,依赖 npm 化管理
  • 改名 ckplayer → MoePlayer,单文件拆分为 ES Module
  • 皮肤系统:CSS 变量 + SVG 图标(核心与 UI 完全分层留待后续渐进重构)
  • 协议插件化:按 URL 自动识别 m3u8/flv/ts 插件,flv 改用 mpegts.js(移除已停维护的 flv.js
  • 移动端 H5 兼容性专项(iOS 全屏/iPad UA/X5 同层/触摸拖动已修复,滑动手势等增强待排期)
  • Moodle media 插件(moodle-media_moeplayer
  • 完整中文文档

相关项目

  • moodle-media_moeplayerMoodle media 插件,把 MoePlayer 接入 Moodle(播放器资源内打包,安装即用)

更新日志

CHANGELOG.md

致谢

感谢 ckplayer 原作者 niandeng 的开源工作,本项目在其 X3 版本基础上继续演进。

协议

MIT © MoePlayer 项目 & ckplayer 原作者 niandeng