benwiley4000 / cassette

📼 A flexible media player component library for React that requires no up-front config
https://benwiley4000.github.io/cassette/styleguide
MIT License
184 stars 28 forks source link

Google Chrome - Rewind media not working #414

Closed marspion closed 5 years ago

marspion commented 5 years ago

Hello,

I have a problem with rewinding media back and forward on Google Chrome browser (73.0.3683.103). Every time when I try to rewind media it is starting from begin.

I tested same code on Firefox browser (66.0.2) and everything works properly.

There is configuration for AudioPlayer component (1.5.0 v). audio_player

Is it possible to fix it by some configuration?

benwiley4000 commented 5 years ago

Hey @marspion, could you share a bit more code so I can understand what you're trying to do? What are you calling to rewind the media?

If you're referring to the button in the UI, we're using the wrong symbol for v1.5. It should be a back skip button but it looks like the rewind symbol (this is fixed in version 2).

But I suspect you're referring to something different since you said your code works in Firefox. If you'd be able to share, that would be great!

marspion commented 5 years ago

Hello,

thank you for your fast response and I would like to apologize for not clear description of problem.

Problem occurs when I try to scroll media by UI progress bar.

I am not able to share more code now but I will prepare example project and I will upload it in few days.

benwiley4000 commented 5 years ago

@marspion I tested locally with your configuration and couldn't repro, but I think I know what your problem is. Your HTTP server should support HTTP Range Request headers to allow seeking in non-linear fashion across your media. Of course if the media is already buffered locally, you shouldn't need HTTP Range Requests, but there is a bug in Chrome related to that. It doesn't exist in Firefox.

I've filed an issue for Chromium already about that problem: https://bugs.chromium.org/p/chromium/issues/detail?id=890593&q=http%20range%20request%20media&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified

and it seems someone was assigned to work on it less than a month ago.

Does this sound related to your issue? If so, we can close this one.

benwiley4000 commented 5 years ago

For adding Range Request support... if you use something like github pages it's done automatically. For other hosts, it may require some manual configuration. I'm not an expert in this so you'll need to Google around.

marspion commented 5 years ago

Hello @benwiley4000

That information was very helpful for me. I had media buffered locally but because of bug in Google Chrome without additional configuration for HTTP Range Requests it didn't work.

Now, when I added HTTP Range Request configuration everything works properly.

We can close this ticket.

Thank you very much for help.

benwiley4000 commented 5 years ago

Great, glad we found the solution!