savokiss / vue-videojs-demo

Use video.js & vue to play RTMP && HLS streams && playback
https://vue-videojs-demo.vercel.app/
MIT License
345 stars 90 forks source link

Uncaught DOMException: Failed to read the 'handle' property from 'MediaSource': MediaSourceHandle creation is currently supported only in a dedicated worker. #12

Open jinleileiking opened 2 years ago

jinleileiking commented 2 years ago

Uncaught DOMException: Failed to read the 'handle' property from 'MediaSource': MediaSourceHandle creation is currently supported only in a dedicated worker.

guardiaopt commented 2 years ago

I have now the same problem.

It's a problem with the latest Chrome update

savokiss commented 2 years ago

This demo is somehow outdated and I'm not in this area recently. Can you provide some more details or a reproduce repo?

Not sure if I can fix this though.

guardiaopt commented 2 years ago

In this page: https://vue-videojs-demo.vercel.app/

Switch Tech: [x] Html5

You can see the problem if you use the latest version of Google Chrome

savokiss commented 2 years ago

@guardiaopt You may have the different issue with @jinleileiking.

Chrome has the HTTPS issue caused by the HLS link which now is HTTP, You can change that link to https and have a try~

BTW, Safari is OK~

savokiss commented 2 years ago

It's ok now~

In this page: https://vue-videojs-demo.vercel.app/

Switch Tech: [x] Html5

You can see the problem if you use the latest version of Google Chrome

guardiaopt commented 2 years ago

Thanks for your help.

I just solved my problem by updating the Video.js CDN links

I think the problem in Chrome was related to this change:

Chrome 105 Changelog Media Source Extensions in Workers The Media Source Extensions (MSE) API is now available from DedicatedWorker contexts to enable improved performance of buffering media for playback by an HTMLMediaElement on the main Window context. By creating a MediaSource object in a DedicatedWorker, an application may then obtain a MediaSourceHandle from it and call postMessage() to transfer it to the main thread for attaching to an HTMLMediaElement. The context that created the MediaSource object may then use it to buffer media.

sampath88 commented 2 years ago

Uncaught DOMException: Failed to read the 'handle' property from 'MediaSource': MediaSourceHandle creation is currently supported only in a dedicated worker.

I had same issue.

sampath88 commented 2 years ago

Uncaught DOMException: Failed to read the 'handle' property from 'MediaSource': MediaSourceHandle creation is currently supported only in a dedicated worker.

I had same issue.

Finally i updated the Video.js to latest version. Now it's working fine. Thank you.

savokiss commented 2 years ago

@sampath88 Glad to hear, This repo including vue-video-player may be outdated too. Using the latest version may help.