search

vidstack / player

UI components and hooks for building video/audio players on the web. Robust, customizable, and accessible. Modern alternative to JW Player and Video.js.
https://vidstack.io
MIT License
1.89k stars 114 forks source link

Bug with thumbnail.vtt and sprite png #1295

Closed nvtienlg closed 3 weeks ago

nvtienlg commented 1 month ago

WEBVTT

00:00:00.000 --> 00:01:02.000 thumbnail.png#xywh=0,0,160,90

00:01:02.000 --> 00:01:34.000 thumbnail.png#xywh=160,0,160,90

00:01:34.000 --> 00:02:06.000 thumbnail.png#xywh=320,0,160,90

...

with url https://demo.com/path/thumbnail.vtt player loads https://demo.com/thumbnail.png [Wrong] instead of https://demo.com/path/thumbnail.png [Correct]

it works fine with jpg extension image

Tested with latest version via CDN, here is live demo for you test it here: https://www.vidstack.io/player/demo?framework=react&view=player

Thank you

mihar-22 commented 3 weeks ago

I can't repro this, the test link has expired. If you can provide a new link then I can reopen and test this issue, thanks!

nvtienlg commented 1 week ago

Hello,

Sorry forgot to update this. I found the root cause. It is not about file extensions, but url format Let say my player page is at https://demo.com/player, thumbnail is at https://demo.com/{videoId}/thumbnail.vtt (same host with player).

So both settings bellow should work: layout: new VidstackPlayerLayout({ thumbnails: 'https://demo.com/{videoId}/thumbnail.vtt' }), layout: new VidstackPlayerLayout({ thumbnails: '/{videoId}/thumbnail.vtt' }),

But only first one is working