NPlayer可定制的弹幕视频播放器

NPlayer 是由 Typescript 加 Sass 编写，无任何第三方运行时依赖，Gzip 大小只有 21KB，兼容 IE11，支持 SSR。该播放器高度可定制，所有图标、按钮、色彩等都可以替换，并且提供了 内置组件 方便二次开发。它还拥有插件系统，弹幕功能 就是使用插件形式提供。该播放器可以接入任何 流媒体，如 hls、dash 和 flv 等。

兼容

NPlayer 兼容 IE11, Edge, Chrome, FireFox, Safari 等现代浏览器。

安装

npm i -S nplayer

或者使用 CDN

<script src="https://unpkg.com/nplayer@latest/dist/index.min.js"></script>

快速使用

import Player from "nplayer";
import Danmaku from "@nplayer/danmaku";
import items from "./items";

const danmaku = new Danmaku({
  items
});

/**
 * 官网：https://nplayer.js.org/
 * 源码：https://github.com/woopen/nplayer
 * 
 * 
 * 测试视频地址
 * https://blog.csdn.net/qq_17497931/article/details/80824328
 *
 * 部分地址
 * https://stream7.iqilu.com/10339/upload_transcode/202002/18/20200218114723HDu3hhxqIT.mp4
 * https://stream7.iqilu.com/10339/upload_transcode/202002/18/20200218093206z8V1JuPlpe.mp4
 * https://stream7.iqilu.com/10339/article/202002/18/2fca1c77730e54c7b500573c2437003f.mp4
 *
 * 还可以使用 .m3u8 .mpd 等视频格式，请引入 hls.js 等
 * 参考 https://nplayer.js.org/docs/streaming
 */

const player = new Player({
  src: "https://v-cdn.zjol.com.cn/280443.mp4",
  plugins: [danmaku]
});

player.mount(document.body);

文档

你可以在 nplayer.js.org 查看 NPlayer 的文档。

查看 快速入门章节 来快速上手 NPlayer。