Add redirect support for manifest and media requests (#1213)

* Add redirect support for manifest and media requests (#912)

* Add an option to enable manifest redirects support (#912)

Author: SleepWalker

README.md

@@ -243,6 +243,16 @@ is set to `true`.
 See html5rocks's [article](http://www.html5rocks.com/en/tutorials/cors/)
 for more info.
 
+##### handleManifestRedirects
+* Type: `boolean`
+* Default: `false`
+* can be used as a source option
+* can be used as an initialization option
+
+When the `handleManifestRedirects` property is set to `true`, manifest requests
+which are redirected will have their URL updated to the new URL for future
+requests.
+
 ##### useCueTags
 * Type: `boolean`
 * can be used as an initialization option

src/master-playlist-controller.js

@@ -223,7 +223,7 @@ export const mimeTypesForPlaylist_ = function(master, media) {
 };
 
 /**
- * the master playlist controller controller all interactons
+ * the master playlist controller controls all interactons
  * between playlists and segmentloaders. At this time this mainly
  * involves a master playlist and a series of audio playlists
  * if they are available
@@ -237,6 +237,7 @@ export class MasterPlaylistController extends videojs.EventTarget {
 
     let {
       url,
+      handleManifestRedirects,
       withCredentials,
       mode,
       tech,
@@ -253,21 +254,22 @@ export class MasterPlaylistController extends videojs.EventTarget {
 
     Hls = externHls;
 
-    this.withCredentials = withCredentials;
     this.tech_ = tech;
     this.hls_ = tech.hls;
     this.mode_ = mode;
     this.useCueTags_ = useCueTags;
     this.blacklistDuration = blacklistDuration;
     this.enableLowInitialPlaylist = enableLowInitialPlaylist;
+
     if (this.useCueTags_) {
       this.cueTagsTrack_ = this.tech_.addTextTrack('metadata',
         'ad-cues');
       this.cueTagsTrack_.inBandMetadataTrackDispatchType = '';
     }
 
     this.requestOptions_ = {
-      withCredentials: this.withCredentials,
+      withCredentials,
+      handleManifestRedirects,
       timeout: null
     };
 
@@ -304,7 +306,7 @@ export class MasterPlaylistController extends videojs.EventTarget {
     };
 
     // setup playlist loaders
-    this.masterPlaylistLoader_ = new PlaylistLoader(url, this.hls_, this.withCredentials);
+    this.masterPlaylistLoader_ = new PlaylistLoader(url, this.hls_, this.requestOptions_);
     this.setupMasterPlaylistLoaderListeners_();
 
     // setup segment loaders

src/media-groups.js

@@ -352,7 +352,7 @@ export const initialize = {
       mode,
       hls,
       segmentLoaders: { [type]: segmentLoader },
-      requestOptions: { withCredentials },
+      requestOptions,
       master: { mediaGroups },
       mediaTypes: {
         [type]: {
@@ -383,7 +383,7 @@ export const initialize = {
         if (properties.resolvedUri) {
           playlistLoader = new PlaylistLoader(properties.resolvedUri,
                                               hls,
-                                              withCredentials);
+                                              requestOptions);
         } else {
           // no resolvedUri means the audio is muxed with the video when using this
           // audio track
@@ -429,7 +429,7 @@ export const initialize = {
       tech,
       hls,
       segmentLoaders: { [type]: segmentLoader },
-      requestOptions: { withCredentials },
+      requestOptions,
       master: { mediaGroups },
       mediaTypes: {
         [type]: {
@@ -463,7 +463,7 @@ export const initialize = {
           id: variantLabel,
           playlistLoader: new PlaylistLoader(properties.resolvedUri,
                                              hls,
-                                             withCredentials)
+                                             requestOptions)
         }, properties);
 
         setupListeners[type](type, properties.playlistLoader, settings);

src/playlist-loader.js

@@ -1,30 +1,29 @@
 /**
- * @file playlist-loader.js
+ * @module playlist-loader
  *
- * A state machine that manages the loading, caching, and updating of
+ * @file A state machine that manages the loading, caching, and updating of
  * M3U8 playlists.
- *
  */
 import resolveUrl from './resolve-url';
 import { mergeOptions, EventTarget, log } from 'video.js';
 import m3u8 from 'm3u8-parser';
 import window from 'global/window';
 
 /**
-  * Returns a new array of segments that is the result of merging
-  * properties from an older list of segments onto an updated
-  * list. No properties on the updated playlist will be overridden.
-  *
-  * @param {Array} original the outdated list of segments
-  * @param {Array} update the updated list of segments
-  * @param {Number=} offset the index of the first update
-  * segment in the original segment list. For non-live playlists,
-  * this should always be zero and does not need to be
-  * specified. For live playlists, it should be the difference
-  * between the media sequence numbers in the original and updated
-  * playlists.
-  * @return a list of merged segment objects
-  */
+ * Returns a new array of segments that is the result of merging
+ * properties from an older list of segments onto an updated
+ * list. No properties on the updated playlist will be overridden.
+ *
+ * @param {Array} original the outdated list of segments
+ * @param {Array} update the updated list of segments
+ * @param {Number=} offset the index of the first update
+ * segment in the original segment list. For non-live playlists,
+ * this should always be zero and does not need to be
+ * specified. For live playlists, it should be the difference
+ * between the media sequence numbers in the original and updated
+ * playlists.
+ * @return a list of merged segment objects
+ */
 export const updateSegments = (original, update, offset) => {
   const result = update.slice();
 
@@ -172,18 +171,24 @@ export const refreshDelay = (media, update) => {
  * Load a playlist from a remote location
  *
  * @class PlaylistLoader
- * @extends Stream
+ * @extends videojs.EventTarget
  * @param {String} srcUrl the url to start with
- * @param {Boolean} withCredentials the withCredentials xhr option
- * @constructor
+ * @param {Object} hls
+ * @param {Object} [options]
+ * @param {Boolean} [options.withCredentials=false] the withCredentials xhr option
+ * @param {Boolean} [options.handleManifestRedirects=false] whether to follow redirects, when any
+ *        playlist request was redirected
  */
 export default class PlaylistLoader extends EventTarget {
-  constructor(srcUrl, hls, withCredentials) {
+  constructor(srcUrl, hls, options) {
     super();
 
+    options = options || {};
+
     this.srcUrl = srcUrl;
     this.hls_ = hls;
-    this.withCredentials = withCredentials;
+    this.withCredentials = !!options.withCredentials;
+    this.handleManifestRedirects = !!options.handleManifestRedirects;
 
     if (!this.srcUrl) {
       throw new Error('A non-empty playlist URL is required');
@@ -360,7 +365,7 @@ export default class PlaylistLoader extends EventTarget {
 
     // there is already an outstanding playlist request
     if (this.request) {
-      if (resolveUrl(this.master.uri, playlist.uri) === this.request.url) {
+      if (playlist.resolvedUri === this.request.url) {
         // requesting to switch to the same playlist multiple times
         // has no effect after the first
         return;
@@ -376,14 +381,16 @@ export default class PlaylistLoader extends EventTarget {
     }
 
     this.request = this.hls_.xhr({
-      uri: resolveUrl(this.master.uri, playlist.uri),
+      uri: playlist.resolvedUri,
       withCredentials: this.withCredentials
     }, (error, req) => {
       // disposed
       if (!this.request) {
         return;
       }
 
+      playlist.resolvedUri = this.resolveManifestRedirect(playlist.resolvedUri, req);
+
       if (error) {
         return this.playlistRequestError(this.request, playlist.uri, startingState);
       }
@@ -399,6 +406,28 @@ export default class PlaylistLoader extends EventTarget {
     });
   }
 
+  /**
+   * Checks whether xhr request was redirected and returns correct url depending
+   * on `handleManifestRedirects` option
+   *
+   * @api private
+   *
+   * @param  {String} url - an url being requested
+   * @param  {XMLHttpRequest} req - xhr request result
+   *
+   * @return {String}
+   */
+  resolveManifestRedirect(url, req) {
+    if (this.handleManifestRedirects &&
+      req.responseURL &&
+      url !== req.responseURL
+    ) {
+      return req.responseURL;
+    }
+
+    return url;
+  }
+
   /**
    * pause loading of the playlist
    */
@@ -492,6 +521,8 @@ export default class PlaylistLoader extends EventTarget {
 
       this.state = 'HAVE_MASTER';
 
+      this.srcUrl = this.resolveManifestRedirect(this.srcUrl, req);
+
       parser.manifest.uri = this.srcUrl;
 
       // loaded a master playlist
@@ -521,14 +552,14 @@ export default class PlaylistLoader extends EventTarget {
         },
         uri: window.location.href,
         playlists: [{
-          uri: this.srcUrl
+          uri: this.srcUrl,
+          resolvedUri: this.srcUrl,
+          // m3u8-parser does not attach an attributes property to media playlists so make
+          // sure that the property is attached to avoid undefined reference errors
+          attributes: {}
         }]
       };
       this.master.playlists[this.srcUrl] = this.master.playlists[0];
-      this.master.playlists[0].resolvedUri = this.srcUrl;
-      // m3u8-parser does not attach an attributes property to media playlists so make
-      // sure that the property is attached to avoid undefined reference errors
-      this.master.playlists[0].attributes = this.master.playlists[0].attributes || {};
       this.haveMetadata(req, this.srcUrl);
       return this.trigger('loadedmetadata');
     });

src/videojs-contrib-hls.js

@@ -260,7 +260,7 @@ class HlsHandler extends Component {
        this.options_.bandwidth === INITIAL_BANDWIDTH;
 
     // grab options passed to player.src
-    ['withCredentials', 'bandwidth'].forEach((option) => {
+    ['withCredentials', 'bandwidth', 'handleManifestRedirects'].forEach((option) => {
       if (typeof this.source_[option] !== 'undefined') {
         this.options_[option] = this.source_[option];
       }

test/master-playlist-controller.test.js

@@ -136,6 +136,26 @@ QUnit.test('obeys none preload option', function(assert) {
   assert.equal(this.player.tech_.hls.stats.bandwidth, 4194304, 'default bandwidth');
 });
 
+QUnit.test('passes options to PlaylistLoader', function(assert) {
+  const options = {
+    url: 'test',
+    tech: this.player.tech_
+  };
+
+  let controller = new MasterPlaylistController(options);
+
+  assert.notOk(controller.masterPlaylistLoader_.withCredentials, 'credentials wont be sent by default');
+  assert.notOk(controller.masterPlaylistLoader_.handleManifestRedirects, 'redirects are ignored by default');
+
+  controller = new MasterPlaylistController(Object.assign({
+    withCredentials: true,
+    handleManifestRedirects: true
+  }, options));
+
+  assert.ok(controller.masterPlaylistLoader_.withCredentials, 'withCredentials enabled');
+  assert.ok(controller.masterPlaylistLoader_.handleManifestRedirects, 'handleManifestRedirects enabled');
+});
+
 QUnit.test('obeys auto preload option', function(assert) {
   this.player.preload('auto');
   // master

test/playlist-loader.test.js

@@ -956,6 +956,68 @@ QUnit.test('recognizes domain-relative URLs', function(assert) {
               'resolved segment URI');
 });
 
+QUnit.test('recognizes redirect, when manifest requested', function(assert) {
+  let loader = new PlaylistLoader('manifest/media.m3u8', this.fakeHls, {
+    handleManifestRedirects: true
+  });
+
+  loader.load();
+
+  const manifestRequest = this.requests.shift();
+
+  manifestRequest.responseURL = window.location.protocol + '//' +
+                                'foo-bar.com/manifest/media.m3u8';
+  manifestRequest.respond(200, null,
+                          '#EXTM3U\n' +
+                          '#EXT-X-STREAM-INF:BANDWIDTH=1\n' +
+                          '/media.m3u8\n');
+  assert.equal(loader.master.playlists[0].resolvedUri,
+              window.location.protocol + '//' +
+              'foo-bar.com/media.m3u8',
+              'resolved media URI');
+
+  this.requests.shift().respond(200, null,
+                                '#EXTM3U\n' +
+                                '#EXTINF:10,\n' +
+                                '/00001.ts\n' +
+                                '#EXT-X-ENDLIST\n');
+  assert.equal(loader.media().segments[0].resolvedUri,
+              window.location.protocol + '//' +
+              'foo-bar.com/00001.ts',
+              'resolved segment URI');
+});
+
+QUnit.test('recognizes redirect, when media requested', function(assert) {
+  let loader = new PlaylistLoader('manifest/media.m3u8', this.fakeHls, {
+    handleManifestRedirects: true
+  });
+
+  loader.load();
+
+  this.requests.shift().respond(200, null,
+                                '#EXTM3U\n' +
+                                '#EXT-X-STREAM-INF:BANDWIDTH=1\n' +
+                                '/media.m3u8\n');
+  assert.equal(loader.master.playlists[0].resolvedUri,
+              window.location.protocol + '//' +
+              window.location.host + '/media.m3u8',
+              'resolved media URI');
+
+  const mediaRequest = this.requests.shift();
+
+  mediaRequest.responseURL = window.location.protocol + '//' +
+                             'foo-bar.com/media.m3u8';
+  mediaRequest.respond(200, null,
+                       '#EXTM3U\n' +
+                       '#EXTINF:10,\n' +
+                       '/00001.ts\n' +
+                       '#EXT-X-ENDLIST\n');
+  assert.equal(loader.media().segments[0].resolvedUri,
+              window.location.protocol + '//' +
+              'foo-bar.com/00001.ts',
+              'resolved segment URI');
+});
+
 QUnit.test('recognizes key URLs relative to master and playlist', function(assert) {
   let loader = new PlaylistLoader('/video/media-encrypted.m3u8', this.fakeHls);