video.js README

The project's README from github.com/videojs/video.js. As one markdown file: README.md.

Video.js logo

Video.js - Web Video Player & Framework

NPM

Update: Big changes coming in Video.js 10, early 2026! Read the discussion.

Video.js is a full featured, open source video player for all web-based platforms.

Right out of the box, Video.js supports all common media formats used on the web including streaming formats like HLS and DASH. It works on desktops, mobile devices, tablets, and web-based Smart TVs. It can be further extended and customized by a robust ecosystem of plugins.

Video.js was started in May 2010 and since then:

Table of Contents

Quick Start

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

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

Alternatively, you can include Video.js by getting it from npm, downloading it from GitHub releases or by including it via unpkg or another JavaScript CDN, like CDNjs.

<!-- unpkg : use the latest version of Video.js -->
<link href="https://unpkg.com/video.js/dist/video-js.min.css" rel="stylesheet">
<script src="https://unpkg.com/video.js/dist/video.min.js"></script>

<!-- unpkg : use a specific version of Video.js (change the version numbers as necessary) -->
<link href="https://unpkg.com/[email protected]/dist/video-js.min.css" rel="stylesheet">
<script src="https://unpkg.com/[email protected]/dist/video.min.js"></script>

<!-- cdnjs : use a specific version of Video.js (change the version numbers as necessary) -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.24.0/video-js.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/8.24.0/video.min.js"></script>

Next, using Video.js 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 Video.js options - just make sure it contains valid JSON!

<video
    id="my-player"
    class="video-js"
    controls
    preload="auto"
    poster="//vjs.zencdn.net/v/oceans.png"
    data-setup='{}'>
  <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="https://videojs.com/html5-video-support/" target="_blank">
      supports HTML5 video
    </a>
  </p>
</video>

When the page loads, Video.js 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 player = videojs('my-player');

The videojs function also accepts an options object and a callback to be invoked when the player is ready:

var options = {};

var player = videojs('my-player', options, function onPlayerReady() {
  videojs.log('Your player is ready!');

  // In this context, `this` is the player that was created by Video.js.
  this.play();

  // How about an event listener?
  this.on('ended', function() {
    videojs.log('Awww...over so soon?!');
  });
});

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!

Contributing

Video.js is a free and open source library, and we appreciate any help you're willing to give - whether it's fixing bugs, improving documentation, or suggesting new features. Check out the contributing guide for more! Contributions and project decisions are overseen by the Video.js Technical Steering Committee (TSC).

By submitting a pull request, you agree that your contribution is provided under the Apache 2.0 License and may be included in future releases. No contributor license agreement (CLA) has ever been required for contributions to Video.js. See the Developer's Certificate of Origin 1.1 .

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.

License

Video.js is licensed under the Apache License, Version 2.0. "Video.js" is a registered trademark of Brightcove, Inc.

Sponsorship

Project development is sponsored by the role of Corporate Shepherd, held by various companies throughout the project history:

Video.js uses BrowserStack for compatibility testing.

The free CDN-hosted copy of the libray is sponsored by Fastly.

Website hosting is sponsored by Netlify

video.js (videojs/video.js)

Searching Database…

Что это такое?Video.js — это бесплатный видеоплеер с открытым исходным кодом для всех веб-платформ: полноценный HTML5-плеер, который вдобавок работает как фреймворк (v10) для создания плееров на HTML и React.
Это фреймворк для разработчиков или готовый плеер, который можно просто вставить на страницу?И то и другое: достаточно разместить на странице элемент с атрибутом data-setup — и вы получите работающий плеер, при этом проект является фреймворком, который можно расширять с помощью сотен готовых плагинов.
Как добавить его на свой сайт?Подключите его с бесплатного CDN от Fastly, через npm, из релиза на GitHub или с unpkg/CDNjs. Элемент с атрибутом data-setup (даже с '{}') автоматически инициализируется при загрузке страницы, а можно создать плеер вручную с помощью функции videojs().
Где он вообще работает — только в браузерах на компьютере?Везде, где работает веб: на компьютерах, смартфонах, планшетах и в Smart TV с веб-доступом.
Он правда бесплатный, и нет ли подвоха в лицензии?Это бесплатная библиотека с открытым исходным кодом под лицензией Apache License 2.0 — CLA для контрибьюторов тоже не требуется. Единственный нюанс: 'Video.js' — зарегистрированная торговая марка компании Brightcove, Inc.
Насколько Video.js проверен временем?Очень: проект появился в мае 2010 года, и за это время его использовали миллионы сайтов; только копия, размещённая на CDN, ежемесячно обслуживает миллиарды конечных пользователей, а у проекта 900+ основных контрибьюторов и сотни плагинов.
Что изменится в Video.js 10?README анонсирует большие изменения, которые появятся в Video.js 10 в начале 2026 года, и даёт ссылку на обсуждение; релиз позиционируется как фреймворк медиаплееров для HTML и React.
Можно ли обойтись без автоматической настройки?Да — просто не указывайте атрибут data-setup и инициализируйте плеер вручную функцией videojs(), которая также принимает объект с опциями и колбэк, вызываемый, когда плеер готов.
Creator
videojs
Size
255.4 MB
Stars
40K
Age
16y
Commits · 90 Days