Skip to content
Get packs

Guide · Open source

How to use DPlayer: install, add danmaku and stream video

Updated · written with AI from the project's own documentation and checked against our catalogue data

DPlayer is an open-source HTML5 video player for websites, with a built-in danmaku layer that shows scrolling comments over the video. This guide is for web developers who want to install it, embed it on a page and understand what it supports. By the end you will know the install step, the formats it handles and where to look for the rest of the setup.

DPlayerDIYgod/DPlayer · ★ 16.5k · MIT

Quick start

  1. 1Check Node.js. Make sure Node.js is installed, since the npm install method needs it.
  2. 2Install the package. Run npm install dplayer --save in your project folder.
  3. 3Prepare your video source. Decide whether you are using HLS, FLV, MPEG DASH, WebTorrent or a plain MP4, WebM or Ogg file.
  4. 4Embed the player. Add DPlayer to your page following the initialisation options in the official docs.
  5. 5Enable danmaku. Connect a danmaku backend, such as DPlayer-node or dplayer-live-backend, if you want stored or live comments.
  6. 6Test in the browser. Load the page and check playback, quality switching and subtitles in your target browsers.

What DPlayer is and what it supports

DPlayer is an HTML5 video player that website builders add to their own pages. Its distinguishing feature is danmaku, the scrolling comments that float over a video.

According to the README, DPlayer supports streaming formats including HLS, FLV, MPEG DASH and WebTorrent, plus any other custom streaming format. For plain files it lists MP4 H.264, WebM and Ogg Theora Vorbis.

  • Streaming: HLS, FLV, MPEG DASH, WebTorrent, custom formats
  • Media: MP4 H.264, WebM, Ogg Theora Vorbis
  • Features: danmaku, screenshot, hotkeys, quality switching, thumbnails, subtitles

Install DPlayer with npm

The README's install method is a package manager. You need Node.js installed, then run the npm command from the README to add DPlayer to your project.

  • Prerequisite: Node.js (for installing from npm)
npm install dplayer --save

Embed the player on a page

Once installed, DPlayer is meant to be embedded in a website or app. The README does not include a full code sample, so check the project docs at dplayer.diygod.dev for the exact initialisation options and markup.

The README links to a Chinese version of the docs as well, at dplayer.diygod.dev/zh/.

Add danmaku and connect a backend

Danmaku is the core feature, so it is worth planning how comments will be stored and delivered. The README lists related projects for the danmaku API in several languages, including DPlayer-node (Node.js), laravel-danmaku (PHP), RailsGun (Ruby) and dplayer-live-backend (Node.js, WebSocket live backend).

The README does not describe the DPlayer server side itself. These projects are listed as separate, community-maintained options.

  • DPlayer-node: Node.js
  • laravel-danmaku: PHP
  • RailsGun: Ruby
  • dplayer-live-backend: Node.js, WebSocket live backend

Choose plugins and tools for your stack

The README lists plugins for several platforms and frameworks, such as WordPress, Hexo, Typecho, Vue and React. It also lists DPlayer-thumbnails for generating video thumbnails.

Check each project's own repository before use, since the README does not describe their maintenance status or features.

  • Vue: Vue-DPlayer
  • React: react-dplayer, rc-dplayer
  • WordPress: DPlayerHandle, Selection, DPlayer for WordPress
  • Thumbnails: DPlayer-thumbnails

What people use it for

  • Embedding a video player with scrolling comments on a fan site or video community
  • Playing HLS, FLV, DASH or WebTorrent streams in one player on the same site
  • Adding a danmaku layer to a video page that already has its own backend
  • Adding DPlayer to a WordPress, Hexo, Vue or React site using a listed plugin

Frequently asked questions

Is DPlayer free to use?

Yes. The README says DPlayer is an MIT licensed open source project and completely free to use. Donations are optional and go toward maintenance.

What do I need to install DPlayer?

The README lists Node.js as the prerequisite for installing from npm. You then run npm install dplayer --save in your project.

Which video formats does DPlayer support?

The README lists HLS, FLV, MPEG DASH, WebTorrent and other custom streaming formats. For media files it lists MP4 H.264, WebM and Ogg Theora Vorbis.

What is danmaku?

Danmaku are scrolling comments that float over a video. DPlayer's main distinguishing feature is this comment layer.

What are the alternatives to DPlayer?

The source names Video.js, Plyr, Artplayer and hls.js as comparable projects. DPlayer is the one focused on danmaku, while the others are general-purpose players.

Does DPlayer include a server?

The README covers only the player front end. Danmaku backends are separate projects listed in the README, such as DPlayer-node and dplayer-live-backend.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

DPlayer suits web developers who want an embeddable, MIT-licensed player with scrolling comments and support for HLS, FLV, DASH and WebTorrent. It is not a good fit for people who just want to watch videos without coding, or for teams that need a complete server-side media pipeline, since the README covers only the front end.

Install options & downloads