search

videojs / http-streaming

HLS, DASH, and future HTTP streaming protocols library for video.js
https://videojs-http-streaming.netlify.app/
Other
2.48k stars 421 forks source link

Safari HLS playback results in error with overrideNative #131

Open ghost opened 6 years ago

ghost commented 6 years ago

kennypavan commented on Feb 13, 2017, 4:12 AM UTC:

Description

Attempting to play a HLS stream in Safari with overrideNative set true results in the errors listed below.

Steps to reproduce

  1. Play video on Safari with options listed below
videojs.options.hls.overrideNative = true;
videojs.options.html5.nativeAudioTracks = false;
videojs.options.html5.nativeVideoTracks = false;

Results

Expected

Video playback and HLS obj available.

Error output

TypeError: Attempted to assign to readonly property TypeError: undefined is not an object (evaluating 'this.messageHandlers')

Additional Information

This appears to be a similar issue to #949 but setting the nativeAudioTracks and nativeVideoTracks to false did not solve the issue.

videojs-contrib-hls version

5.2.0

videojs version

5.17.0

Browsers

Safari v9.0.3

Platforms

OSX 10.11.3

This issue was moved by forbesjo from videojs/videojs-contrib-hls#1005.

ghost commented 6 years ago

gesinger commented on Feb 14, 2017, 8:31 PM UTC:

Thanks for reporting kennypavan . Yeah, we haven't used overrideNative for Safari, and it seems there is an issue here. It definitely warrants further investigation.

ghost commented 6 years ago

kennypavan commented on Feb 15, 2017, 7:57 PM UTC:

No problem. Thanks for your quick response gesinger.

ghost commented 6 years ago

aamelegy commented on Apr 8, 2017, 6:43 PM UTC:

I'm using exactly those three lines in Safari.

videojs.options.hls.overrideNative = true;
videojs.options.html5.nativeAudioTracks = false;
videojs.options.html5.nativeVideoTracks = false;

No errors in the console however still the native HLS is used , Same behaviour in Android Chrome

ghost commented 6 years ago

drakunov commented on Apr 10, 2017, 6:25 AM UTC:

This error on Safari 10.0.2, OSX 10.12.2 using videojs.options.hls.overrideNative = true; videojs.options.html5.nativeAudioTracks = false; videojs.options.html5.nativeVideoTracks = false;

[Info] Source changed to auto (path, line 75) [Error] VIDEOJS: (4) "ERROR:" "(CODE:3 MEDIA_ERR_DECODE)" "The media playback was aborted due to a corruption problem or because the media used features your browser did not support." d {code: 3, message: "The media playback was aborted due to a corruption…media used features your browser did not support.", status: null, MEDIA_ERR_CUSTOM: 0, MEDIA_ERRABORTED: 1, …} logByType (video.min.js:18:21374) error (video.min.js:15:22741) handleTechError (video.min.js:15:14221) dispatcher (video.min.js:18:18660) [Log] JavaScript error: InvalidStateError (DOM Exception 11): The object is in an invalid state. on line 6 for http://urlurl/contrib/videojs-contrib-hls.min.js (mobile-logger.js, line 6) [Error] InvalidStateError (DOM Exception 11): The object is in an invalid state. value (videojs-contrib-hls.min.js:6:29976) (anonymous function) (videojs-contrib-hls.min.js:2:29983) (anonymous function) value (videojs-contrib-hls.min.js:2:30886) value (videojs-contrib-hls.min.js:2:30728) value (videojs-contrib-hls.min.js:2:29943) value (videojs-contrib-hls.min.js:2:27144) value (videojs-contrib-hls.min.js:2:26279) value (videojs-contrib-hls.min.js:2:26082) value (anonymous function) (videojs-contrib-hls.min.js:3:12748) j (video.min.js:19)`

ghost commented 6 years ago

sbminimalistics commented on Jun 15, 2017, 8:22 AM UTC:

Guys, what is the status of this issue? Is there any way to overwrite native hls player on Safari? The thing why I'm asking this is the fact that m3u8 manipulation is easy doable through videojs.Hls.xhr.beforeRequest method. Alas it's not available when native playback is on.

test environment on my machine: videojs-contrib-hls Version 5.5.3 Video.js 6.2.0 flags rewriting: videojs.options.html5.nativeAudioTracks = false; videojs.options.html5.nativeVideoTracks = false; videojs.options.hls.overrideNative = true;

ghost commented 6 years ago

jorisvervuurt commented on Jun 16, 2017, 2:14 PM UTC:

+1 for sbminimalistics: I'd like to know too, because I'd like to set the beforeRequest method in Safari too. Ain't possible right now (latest Video.js 6 release). :-(

ghost commented 6 years ago

petrklus commented on Jun 20, 2017, 11:07 AM UTC:

+1 for sbminimalistics from my end too - seeing the issue on Safari 10, vjs version 5 and latest HLS.

ghost commented 6 years ago

brycefisher commented on Aug 29, 2017, 7:03 PM UTC:

Discussed this issue today on the Videojs Slack channel. I'm also having a possibly related problem.

One possible solution raised by the maintainers was to avoid using the html element <source>, since Safari might start using the native HLS implementation before contrib-hls has a chance to intercept it. Instead, avoid creating a <source> element inside the video tag. Manually call player.src('https://example.com/hls.m3u8') so that videojs can fully control the process.

This solution didn't work for me, but I'm on a different version of videojs and contrib-hls than the OP. It might be worth a quick try?

ghost commented 6 years ago

gfx0 commented on Sep 8, 2017, 1:35 PM UTC:

Changing the source using an object like may also help with this problem: player.src( { src: 'https://example.com/hls.m3u8', type: "application/x-mpegURL", withCredentials: false } )

ghost commented 6 years ago

buccfer commented on Oct 19, 2017, 7:29 PM UTC:

gesinger Is there any update on this? I'm experiencing issues with Safari and overrideNative as well.

Best.

ghost commented 6 years ago

sbminimalistics commented on Oct 20, 2017, 6:58 AM UTC:

As far as I know there are no updates on this. Also it depends which Safari you have in mind. Native playback can not be overridden if "Media Source Extensions" is not supported. With that in mind, information given over here http://caniuse.com/#search=mse implies that at the moment native playback could not be overridden on iOS Safari doesn't matter how much effort you pay. But from my understanding Safari on Mac should be able to handle hls non natively. But as guys on this thread mentioned there are some errors popping out while playing hls non-natively on non-mobile Safari.

ghost commented 6 years ago

tchakabam commented on Oct 24, 2017, 4:04 PM UTC:

Hey,

The problem is just that you are getting the options wrong.

This is how it should work like:

var player = videojs('example-video', {
  html5: {  
    nativeAudioTracks: false,
    nativeVideoTracks: false,
    hls: {
      debug: true,
      overrideNative: true
    }
}});

NOTE that the hls options always are embedded inside the html5 tech options - this is the mistake in your above configuration.

This isn't a bug, I got this working flawlessly with the above snippet.

EDIT: Your Safari still needs to support MediaSource obviously, which is from Yosemite and above as far as I remember.

EDIT: Note that mobile Safari does never support MediaSource

ghost commented 6 years ago

tchakabam commented on Oct 25, 2017, 9:13 AM UTC:

Please check this test-page: http://tchakabam.com/test/2coders-videojs/

IMPORTANT: You need to press the "load" button to make sure videojs-hls initializes correctly with the desired config (not using native Safari HLS precisely).

This behavior (needing to press load) is only on Safari, and it may be a bug that need to be investigated.

However this example shows that generally the config can be applied to do this.

We should probably close/rewrite this issue to what it really is.

ghost commented 6 years ago

yoshz commented on Dec 6, 2017, 11:05 AM UTC:

I can confirm that this issue still exists even with the options set right tchakabam. With overrideNative enabled on Safari 8 it doesn't start at all because of the errors and on Safari 10/11 it fails to load files when you seek to a different time.

ghost commented 6 years ago

shreysaroch commented on Dec 26, 2017, 10:41 AM UTC:

Issue persists on and above iOS 11.2.1,videojs works perfect on and below iOS 11.0

What is the current status?

ghost commented 6 years ago

m1neral commented on Jan 8, 2018, 10:34 AM UTC:

Failed in safari <= 9

[Error] TypeError: Attempted to assign to readonly property. (blob:http://localhost:3000/bc24f9dd-aa20-4aef-9d5f-304314fa0b7a, line 19565)
[Error] TypeError: undefined is not an object (evaluating 'this.messageHandlers') (blob:http://localhost:3000/bc24f9dd-aa20-4aef-9d5f-304314fa0b7a, line 19569, x3)
ghost commented 6 years ago

bamboodigital commented on Feb 1, 2018, 10:27 AM UTC:

Confirming this is still an issue on the following versions, any updates on a solution in progress? :

VideoJS 6.6.0

videojs-contrib-hls 5.12.2

Safari 11.0.2

Errors

[Error] TypeError: Attempted to assign to readonly property. [Error] TypeError: undefined is not an object (evaluating 'sortedSegments.audio.initSegment.byteLength') [Error] TypeError: Attempted to assign to readonly property. [Error] Unhandled Promise Rejection: [object DOMError]

ghost commented 6 years ago

RafalLukawiecki commented on Feb 2, 2018, 12:03 AM UTC:

Same issue

ghost commented 6 years ago

pureexe commented on Feb 2, 2018, 6:53 AM UTC:

same issue here.

ghost commented 6 years ago

wugengsong commented on Feb 11, 2018, 12:47 PM UTC:

same issue

ghost commented 6 years ago

harshil93 commented on Feb 11, 2018, 9:32 PM UTC:

Happening on Chrome Mobile, Edge Mobile and Edge desktop

ghost commented 6 years ago

harshil93 commented on Feb 11, 2018, 9:55 PM UTC:

This happens when your video.js and contrib-hls.js are loaded after your video tag is already created.

Put your js files before your video elements and everything works fine.

ghost commented 6 years ago

chaner commented on Feb 14, 2018, 12:28 AM UTC:

Ran it in debug, seeing undefined is not an object (evaluating 'this.tech_.hls.xhr. Somehow the xhr object is not being instantiated on iOS.

ghost commented 6 years ago

chaner commented on Feb 14, 2018, 12:52 AM UTC:

Debugged further, looks like MediaSource is undefined:

https://forums.developer.apple.com/thread/90712

ghost commented 6 years ago

RafalLukawiecki commented on Mar 22, 2018, 10:01 AM UTC:

chaner regarding your comment on 14 Feb. The link you provided relates to iOS Safari, where Media Source is undefined. However, this issue affects the regular, desktop Safari on recent macOS, which has supported MediaSource for a while. Have I misunderstood you, perhaps? Apologies if so.

HankBrown commented 5 years ago

How very distressing. It's too easy to capture native hls in iPhone. Must have override to completely fool the download helpers. Subscribing here in case there is an update.

vksbansal commented 5 years ago

same issue with normal (non drm) m3u8 stream.. please help on osx safari

gkatsev commented 5 years ago

FYI, desktop Safari for the past version or two has supported MSE-based playback. This means that you can use overrideNative to use VHS on desktop safari. It should generally work, but we haven't done extensive testing with it. iOS Safari is a whole other matter and MSE is not supported there and won't be supported any time soon, unfortunately.

vksbansal commented 5 years ago

@gkatsev it's working with some streams however for some streams it is not working, if you may provide me with a way to send the stream URL privately then I can provide you with the .m3u8 (non-DRM) that is not working when setting the overrideNative set to true

istng commented 2 years ago

I got hls object working on Safari by using the three lines of overrideNative above, and setting the source of videojs on js instead as the source html tag, as it is written above as well. Thanks friendly ghosts!