{"id":15070116,"url":"https://github.com/srgssr/videojs-hlsjs","last_synced_at":"2025-10-12T10:09:13.391Z","repository":{"id":57392267,"uuid":"76879695","full_name":"SRGSSR/videojs-hlsjs","owner":"SRGSSR","description":"HLS playback plugin for videojs","archived":false,"fork":false,"pushed_at":"2017-11-07T10:24:08.000Z","size":1763,"stargazers_count":27,"open_issues_count":1,"forks_count":16,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-02-03T05:23:39.162Z","etag":null,"topics":["hls","hlsjs","javascript","video","videojs"],"latest_commit_sha":null,"homepage":"https://srgssr.github.io/videojs-hlsjs/demo","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/SRGSSR.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE-MIT","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-12-19T16:48:18.000Z","updated_at":"2024-05-30T15:35:25.000Z","dependencies_parsed_at":"2022-09-11T21:53:27.493Z","dependency_job_id":null,"html_url":"https://github.com/SRGSSR/videojs-hlsjs","commit_stats":null,"previous_names":[],"tags_count":36,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SRGSSR%2Fvideojs-hlsjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SRGSSR%2Fvideojs-hlsjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SRGSSR%2Fvideojs-hlsjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/SRGSSR%2Fvideojs-hlsjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/SRGSSR","download_url":"https://codeload.github.com/SRGSSR/videojs-hlsjs/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":239325290,"owners_count":19620260,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hls","hlsjs","javascript","video","videojs"],"created_at":"2024-09-25T01:48:13.372Z","updated_at":"2025-10-12T10:09:08.357Z","avatar_url":"https://github.com/SRGSSR.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Videojs hls.js Plugin\n\n\u003cimg align=\"right\" height=\"30\" src=\"http://www.srgssr.ch/fileadmin/templates/images/SRGLogo.gif\"\u003e\n\n\u003e An HLS plugin for video.jas based on hls.js\n\nVideojs hls.js offers hls playback using [hls.js](https://github.com/dailymotion/hls.js). For more details on browser compatibility see th hls.js github page.\n\n- [Getting Started](#getting-started)\n- [Documentation](#documentation)\n  - [Dependencies](#dependencies)\n  - [CORS Considerations](#cors-considerations)\n  - [Options](#options)\n  - [Event Listeners](#event-listeners)\n- [Original Author](#original-author)\n\n## Getting Started\n\nDownload videojs-hlsjs and include it in your page along with video.js:\n\n```html\n\u003cvideo id=\"video\" preload=\"auto\" class=\"video-js vjs-default-skin\" controls\u003e\n    \u003csource src=\"http://www.streambox.fr/playlists/x36xhzz/x36xhzz.m3u8\" type=\"application/vnd.apple.mpegurl\"\u003e\n\u003c/video\u003e\n\u003cscript src=\"hlsjs.min.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"video.min.js\"\u003e\u003c/script\u003e\n\u003cscript src=\"videojs-hlsjs.min.js\"\u003e\u003c/script\u003e\n\u003cscript\u003e\n    var player = videojs('video', {\n        // hlsjs tech should come before html5, if you want to give precedence to native HLS playback\n        // use the favorNativeHLS option.\n        techOrder: [\"hlsjs\", \"html5\", \"flash\"]\n    });\n\u003c/script\u003e\n```\n\nThere's also a [demo](https://srgssr.github.io/videojs-hlsjs/demo) of the plugin that you can check out.\n\n## Changelog\n\n- 1.4.5: Added text and audio tracks compatibility.\n\n## Documentation\n\n### Dependencies\nThis project depends on:\n\n- [video.js](https://github.com/videojs/video.js) 5.8.5+.\n- [hls.js](https://github.com/dailymotion/hls.js) 0.7.0+.\n\n### CORS Considerations\n\nAll HLS resources must be delivered with\n[CORS headers](https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS) allowing GET requests.\n\n### Options\n\nYou may pass in an options object to the hls playback technology at player initialization.\n\n#### hlsjs.favorNativeHLS\nType: `Boolean`\n\nWhen the `favorNativeHLS` property is set to `true`, the plugin will prioritize native hls\nover MSE. Note that in the case native streaming is available other options won't have any effect.\n\n#### hlsjs.disableAutoLevel\nType: `Boolean`\n\nWhen the `disableAutoLevel` property is set to `true`, the plugin will completely disable auto leveling based on bandwidth and remove it from the list of available level options.\nIf no level is specified in `hlsjs.startLevelByHeight` or `hlsjs.setLevelByHeight` the plugin will start with the best quality available when this property is set to true.\nUseful for browsers that have trouble switching between different qualities.\n\n#### hlsjs.startLevelByHeight\nType: `Number`\n\nWhen the `startLevelByHeight` property is present, the plugin will start the video on the closest quality to the\nspecified height but the auto leveling will still be enabled unless `hlsjs.disableAutoLevel` was set to `true`. If height metadata is not present in the HLS playlist this property will be ignored.\n\n#### hlsjs.setLevelByHeight\nType: `Number`\n\nWhen the `setLevelByHeight` property is present, the plugin will start the video on the closest quality to the\nspecified height. The auto leveling will be disabled but it will still be selectable unless `hlsjs.disableAutoLevel` was set to `true`. If height metadata is not present in the HLS playlist this property will be ignored.\n\nThis property takes precedence over `hlsjs.startLevelByHeight`.\n\n#### hlsjs.hls\nType `object`\n\nAn object containing hls.js configuration parameters, see in detail:\n[Hls.js Fine Tuning](https://github.com/dailymotion/hls.js/blob/master/doc/API.md#fine-tuning).\n\n**Exceptions:**\n\n* `autoStartLoad` the loading is done through the `preload` attribute of the video tag. This property is always set to `false` when using this plugin.\n* `startLevel` if you set any of the level options above this property will be ignored.\n\n### Event listeners\n\nThis plugin offers the possibility to attach a callback to any hls.js runtime event, see the documetation\nabout the different events here: [Hls.js Runtime Events](https://github.com/dailymotion/hls.js/blob/master/doc/API.md#runtime-events). Simply precede the name of the event in camel case by `on`, see an example:\n\n```js\nvar player = videojs('video', {\n    hlsjs: {\n        /**\n         * Will be called on Hls.Events.MEDIA_ATTACHED.\n         *\n         * @param {Hls} hls      The hls instance from hls.js\n         * @param {Object} data  The data from this HLS runtime event\n         */\n        onMediaAttached: function(hls, data) {\n            // do stuff...\n        }\n    }\n});\n```\n\n## Original Author\n\nThis project was orginally forked from: [videojs-hlsjs](https://github.com/benjipott/videojs-hlsjs), credits to the\noriginal author.","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrgssr%2Fvideojs-hlsjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsrgssr%2Fvideojs-hlsjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsrgssr%2Fvideojs-hlsjs/lists"}