Video Scrubbing not working in chrome

BookStackApp / BookStack

A platform to create documentation/wiki content built with PHP & Laravel

https://www.bookstackapp.com/

MIT License

15.47k stars 1.94k forks source link

Video Scrubbing not working in chrome #5088

Open Jeffrey-FB opened 4 months ago

Jeffrey-FB commented 4 months ago

Attempted Debugging

[X] I have read the debugging page

Searched GitHub Issues

[X] I have searched GitHub for the issue.

Describe the Scenario

I'm trying to scrub in Bookstack Works flawlessly in Firefox but not in anything else. Will not scrub at all, just keeps flipping back to the beginning of the page.

My setting are a bit high. This is all an EC2 instance in AWS with local nvme attached storage. This is in a private cloud. i.e. ping is 1-2ms

nano /etc/php/8.3/fpm/php.ini
#A well as here
/etc/php/8.3/cli/php.ini
#Edit these entries
post_max_size = 1024M
upload_max_filesize = 1024M
memory_limit = 512M

/var/www/bookstack/.env
# Added
# File Upload Limit
# Maximum file size, in megabytes, that can be uploaded to the system.
FILE_UPLOAD_SIZE_LIMIT=250

Why is Chrome not scrubbing, is there a setting i need to enable or disable?

Exact BookStack Version

v24.05.2

Log Content

No response

Hosting Environment

Ubuntu 24.04 LTS php 8.3

ssddanbrown commented 4 months ago

Hi @Jeffrey-FB,

How was the video uploaded to BookStack (or is it located elsewhere)?
How was the video added to the page?

Jeffrey-FB commented 4 months ago

I as this https://user-images.githubusercontent.com/1685517/41506056-e43bc3c8-7233-11e8-83a3-348ae43345a8.gif I've enabled 3rd party cookie's and this has helped a little, but only for some users.

So local upload.

ssddanbrown commented 4 months ago

@Jeffrey-FB Can you instead try just directly dragging the attachment card into the page for the video? As shown here: https://www.bookstackapp.com/images/2024/02/bookstack-video-attachment-drag-drop.mp4

Jeffrey-FB commented 4 months ago

Hey @ssddanbrown

It doesn't make a difference, the enabled cookies now doesn't seem to do anything anymore. It doesn't seem to do the caching or prefetch like it does in firefox.

Not sure if this is suppose to be working or at least not giving errors? I cannot seem to resolve it if it should be working. Screenshot 2024-07-03 104420

ssddanbrown commented 4 months ago

Not sure if this is suppose to be working or at least not giving errors?

I'm assuming that's in relation to the screenshot? If so, the back/forward cache isn't really relevant here.

What size of video does this occur with?
Are you using s3 storage with BookStack at all?
When viewing the page, if you right-click the video and copy video URL into a new tab (or select to open video in new tab) does it work there?
- Can you share the video URL (can hide/remove the domain if needed, just need to double check the path)?

Just double checked on my dev instance via chromium, and it seems to be working, so might come down to specifics.

Could be helpful to see a screenshot of the "network" tab of the devtools, when starting the video and scrubbing, after the tab was open, with the latest (bottom) requests in view.

Jeffrey-FB commented 4 months ago

Hey @ssddanbrown

I've limited video's to 250MB But the size doesn't matter, I've uploaded files between 13MB to 240MB and they behave the same. Nor does the length of the video.

Path for the 240MB vid 'https://bookstack.my.domain.com/attachments/7'

No not using S3 for anything. Locally nvme drive on the host.

Again all the scrubbing works fine in firefox

Screen shot of the network tab in dev tools Screenshot 2024-07-04 095808

Jeffrey-FB commented 4 months ago

Hey @ssddanbrown

So it turns out it's the default player within Chrome. We test out with another extension, which scrubs okay. Video play up every now and then.

Not sure if there is anything you can do on your end to resolve this?

But just so you know. Common issue across all Chromium based platforms, Chrome, edge, opera, brave.... they all behaving the same.

ssddanbrown commented 4 months ago

Not sure if there is anything you can do on your end to resolve this?

Yeah, not sure. I just double checked via edge 126 (Still on Linux) and seems to work fine. Could be due to some edge case (specific video encoding, OS, specific chrome base version, network conditions etc...). I see some streaming attempts in the network tab screenshot, but hard to know exact scenario without digging deeper into specifics. Could maybe also fundamentally be some issues with how I built the streaming, but I'd need to be able to reproduce really which I havn't been able to do so far.

Jeffrey-FB commented 4 months ago

@ssddanbrown

Appreciate all the help with this. I'd be great if I could at least give you some extra info if you prepared to investigate further?

Let me me know what you need from me and I'll provide as much as I can.