Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »


1.2.25 • Public • Published

videojs-client - HTML5 Video Player

Build Status Coverage Status Slack Status


Table of Contents

Quick Start

Thanks to the awesome folks over at Fastly, there's a free, CDN hosted version of videojs-client that anyone can use. Add these tags to your document's <head>:

<link href="//vjs.zencdn.net/5.19/video-js.min.css" rel="stylesheet">

For the latest version of videojs-client and URLs to use, check out the Getting Started page on our website.

Next, using videojs-client is as simple as creating a <video> element, but with an additional data-setup attribute. At a minimum, this attribute must have a value of '{}', but it can include any videojs-client options - just make sure it contains valid JSON!

  <source src="//vjs.zencdn.net/v/oceans.mp4" type="video/mp4"></source>
  <source src="//vjs.zencdn.net/v/oceans.webm" type="video/webm"></source>
  <source src="//vjs.zencdn.net/v/oceans.ogv" type="video/ogg"></source>
  <p class="vjs-no-js">
    To view this video please enable JavaScript, and consider upgrading to a
    web browser that
    <a href="http://videojs.com/html5-video-support/" target="_blank">
      supports HTML5 video

When the page loads, videojs-client will find this element and automatically setup a player in its place.

If you don't want to use automatic setup, you can leave off the data-setup attribute and initialize a <video> element manually using the videojs function:

    var videojs = require('videojs-client');
    //fix videojs switch can not reset the video problem
    //Toggle video back and forth
  var sources = Object.assign({
        video: [
                type: 'video/youtube'
                src: 'http://vjs.zencdn.net/v/oceans.mp4',
                type: 'video/mp4'
    videojs(vid, {
        sourceOrder: true, //Direct support for playback YouTube playback
        flash: {
            swf: yourswfurl
        sources: sources.video
    }).ready(function() {
        var vm = this;
        setTimeout(function() {
        }, 500);

If you're ready to dive in, the Getting Started page and documentation are the best places to go for more information. If you get stuck, head over to our Slack channel!

Code of Conduct

Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its terms.


videojs-client is licensed under the Apache License, Version 2.0.


- fix videojs switch can not reset the video problem
- support YouTube embedded video playback
- support the use of the latest video.js NPM dependency pack


npm i videojs-client

DownloadsWeekly Downloads






Last publish


  • avatar