MJPEG Stream Not Loading in Safari Due to Service Worker Issue

aaronk6 commented 4 months ago

Checklist

[X] I have updated to the latest available Home Assistant version.
[X] I have cleared the cache of my browser.
[X] I have tried a different browser to see if it is related to my browser.
[X] I have tried reproducing the issue in safe mode to rule out problems with unsupported custom resources.

Describe the issue you are experiencing

I’m using Home Assistant 2024.2.5 (running HAOS 12.0) and have installed the NGINX Home Assistant SSL proxy add-on to access HA via HTTPS. This is working fine, except that in Safari (v. 17.0 and 17.3.1), the MJPEG camera stream won’t load. It’s working fine in Chrome and the Home Assistant macOS app though.

The issue seems to be related to HA’s service worker. In Safari’s private browsing mode, in which service workers aren’t executed, it is working fine. Same without HTTPS, which also bypasses the service worker.

Describe the behavior you expected

I expect the video stream to work in Safari.

Steps to reproduce the issue

Set up the MJPEG camera component
Enter an MJPEG url (i.e. http://doorbird.myhostname.example.com/bha-api/video.cgi)
Enter username and password
Add the camera view to a dashboard using a picture-glance card

What version of Home Assistant Core has the issue?

core-2024.2.5

What was the last working version of Home Assistant Core?

No response

In which browser are you experiencing the issue with?

Safari 17.3.1 (19617.2.4.11.12)

Which operating system are you using to run this browser?

macOS Sonoma (14.3.1)

State of relevant entities

No response

Problem-relevant frontend configuration

- type: picture-glance
  camera_view: live
  entities:
    - binary_sensor.doorbird_motion
  camera_image: camera.doorbird_mjpeg

Javascript errors shown in your browser console/inspector

In Safari, when I go to Develop › Service Workers › myhostname.example.com in a non-private window, I see the following error:

Unhandled Promise Rejection: NetworkError:  A network error occurred.
Failed to load resource: the server responded with a status of 403 ()

Additional information

marcoach commented 3 months ago

Hello,

Same here, I 've tried all the buttons combination without success. If i delete the cache loads the stream for some seconds and then reloads the page and the video is still missing again.

github-actions[bot] commented 3 days ago

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest Home Assistant version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue has now been marked as stale and will be closed if no further activity occurs. Thank you for your contributions.

home-assistant / frontend