dermotduffy / frigate-hass-card

A Lovelace card for Frigate in Home Assistant
MIT License
477 stars 53 forks source link

First clip doesn't load #1368

Closed woempiej closed 2 months ago

woempiej commented 3 months ago

Hi,

I'm using the Frigate Lovelace card. Since the latest update the Lovelace card doesn't show the 1st (latest) video anymore. I'm using the card in the "most recent clip" view.

afbeelding

I need to Android HA app: Swipe to the previous video and then swipe back to the newest video to be able to watch the newest video. Firefox browser: Navigate to another dashboard tab and go back to my "security" tab to be able to watch the newest video. or Choose to edit the HA dashboard > Then it showes the video correctly Chrome browser: Navigate to another dashboard tab and go back to my "security" tab to be able to watch the newest video. or Choose to edit the HA dashboard > Then it showes the video correctly

I did think about the browser cache and history wipe.

No error(s) logs in the HA log No error(s) in the Frigate log

Yesterday I rebuild all of the Frigate installation: Deleted HA add-on Deleted HA integration > Wich the Lovelace card is comming from Deleted all Frigate related files via the file editor Deleted all Media Media > Frigate (Integration folder) Media > My Media > frigate (Add-On folder)

Deleted the Lovelace card and builded it back up via the GUI

  - type: custom:frigate-card
    cameras:
      - camera_entity: camera.frigate_cam1
      - camera_entity: camera.frigate_cam2
      - camera_entity: camera.frigate_cam3
    view:
      default: clip
      update_force: true
      scan:
        show_trigger_status: true
    menu:
      style: outside
      buttons:
        media_player:
          enabled: false
        timeline:
          enabled: false
        live:
          enabled: false
        snapshots:
          enabled: false
    media_viewer:
      controls:
        title:
          mode: none
        thumbnails:
          mode: none
        timeline:
          mode: below
          window_seconds: 28800
    media_gallery:
      controls:
        thumbnails:
          show_favorite_control: false
          show_timeline_control: false
          show_download_control: false
        filter:
          mode: none
dermotduffy commented 3 months ago

Just to make sure I understand, the most recent clip doesn't work, but all the others do? Is this the case no matter how recently the clip was? i.e. even if it was hours ago, the first clip will never work?

woempiej commented 3 months ago

Hi,

That is correct. I have 3 camera's configured in the card. Only the first (default) camera clip acts this way. If I switch to the 2nd or 3rd camera there are no problems.

To be sure I switched the 1st (default) camera to another one > Same bevahiour

dermotduffy commented 3 months ago

I have 3 camera's configured in the card. Only the first (default) camera clip acts this way.

And can you view the same clip that won't load via the HA media browser? (i.e. outside the card, but inside the HomeAssistant Media sidebar tab)

woempiej commented 3 months ago

In the media browser I see the same issue. The first clip doesn't load

wizu commented 3 months ago

I have same problem. In browser console, I have an error, when click on first clip:

96996.w7vKRby48d0.js:1 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'KeySystemFormats')
    at 96996 (96996.w7vKRby48d0.js:1:283711)
    at Function.c (bootstrap:19:32)
    at async p.value (ha-hls-player.ts:112:11)
96996 @ 96996.w7vKRby48d0.js:1
c @ bootstrap:19
log-message.ts:37 

GET https://xxx/unknown/webpack/bootstrap 404 (Not Found)
dermotduffy commented 3 months ago

In the media browser I see the same issue. The first clip doesn't load

Then your issue is not likely related to the card at all, i.e. you are reporting experiencing the same problem even when you're not using the card. At a guess, the Frigate backend may be returning an empty or invalid video stream for that first clip for some reason, so neither the HA media browser nor the card cannot play it.

I would report it upstream and see if anyone has encountered this before. Once it works in the HA media browser, it will work in the card.

woempiej commented 3 months ago

Hi dermotduffy.

I did report it upstream first ;) https://github.com/blakeblackshear/frigate/issues/9827

I think it is not a Frigate Add-on media browser problem because in the media browser of the add-on I do not have issues.

I have 2 media browser directories:

  1. From the Frigate Add-on: Media > My Media > frigate
  2. From this Frigate integration: Media > Frigate

Media directory number 1 does not show this behaviour. Some clips are split in 2 peaces inside the directory. The most recent clip (recording) of Media directory number 2 is showing the same behaviour as the Lovelace card.

Tibladar commented 3 months ago

I don't have that problem but the log line mentioned by @wizu caught my eye:

GET https://xxx/unknown/webpack/bootstrap 404 (Not Found)

I have a different bug (not gonna hijack this issue) but I have the following urls being called when having frigate-integration in a dashboard:

https://xxx/unknown/src/lit-html.ts 404 (Not Found)
https://xxx/unknown/src/scoped-custom-element-registry.js 404 (Not Found)
https://xxx/unknown/src/lit-element.ts 404 (Not Found)
https://xxx/unknown/src/reactive-element.ts 404 (Not Found)
https://xxx/unknown/webpack/bootstrap 404 (Not Found)
https://raw.githubusercontent.com/home-assistant/frontend/20240207.1/src/components/ha-camera-stream.ts 200 (OK)
https://raw.githubusercontent.com/home-assistant/frontend/20240207.1/src/components/ha-hls-player.ts 200 (OK)

Those urls are not called when using mentioned work-arounds (e.g. choosing edit the HA dashboard)

Maybe it's worth investigating where those urls come from?

This occured first when I upgraded the following things (all at once):

What HA version do you use?

woempiej commented 3 months ago

afbeelding

Frigate Add-on 0.13.1

dermotduffy commented 3 months ago

I'm sorry you are being bounced around! On the other issue you mentioned the card and not that this ALSO doesn't work in the stock HA media browser without the card being involved.

I think it is not a Frigate Add-on media browser problem because in the media browser of the add-on I do not have issues.

I think the issue can only be with one of these (none of which are the Frigate add-on, and none of which are the card):

Put simply: You could uninstall the card entirely, and it still wouldn't play in the HA media browser. Can't be the card ;-)

woempiej commented 3 months ago

Hi,

Correct me if I am wrong but your integration is creating a media directory. In this directory I can reproduce the issue. In the media directory provided by the Frigate Add-on I can't

afbeelding

dermotduffy commented 3 months ago

Correct me if I am wrong but your integration is creating a media directory. In this directory I can reproduce the issue.

That's the integration, this repo is the card.

For the integration, all it is doing is showing the user the metadata, it is Frigate backend that provides the video. My theory is still this is a backend issue.

NickM-27 commented 3 months ago

Swipe to the previous video and then swipe back to the newest video to be able to watch the newest video.

This indicates that it is not a backend issue right? Because the same request works after updating the ui?

dermotduffy commented 3 months ago

This indicates that it is not a backend issue right? Because the same request works after updating the ui?

I missed that, great point! However, there must be more than just the card going on here since the issue happens in the stock media browser without the card at all.

@woempiej I wonder if you try to open it in the HA media browser (and it fails), but then you try to open it a second time, does it succeed? [i.e. are we seeing the same symptoms in the media browser as in the card].

Both the card and HA share the same video player code, so it could be that. Or I guess it could be that somehow something on the backend is returning different data on the first and subsequent requests?

woempiej commented 3 months ago

Hi,

Here a small tutorial of my actions to try to reproduce

afbeelding

@dermotduffy Yes the second time in the media browser there is no issue. Because of this, I thought it was a problem just with the default camera in the card but it is not! When I log out of HA en close the browser > Login again and follow the above tutorial to an other camera > It is showing the same behaviour > Latest recording isnt't playing

dermotduffy commented 3 months ago

How strange. Thanks for the walk-thru screenshot. For the record, I can do the same, go to the media browser, choose Recordings, choose a camera, choose the latest available hour -- it will play first time every time. I'm on HA 2024.1.3 (slightly older than you), I can try to upgrade later to see if perhaps something changed in HA itself?

Suggestion: In one window, navigate to "Logs" in your Frigate instance, and choose "Nginx" on the top-right. In another window, repeat your steps above (with the first request that fails, and the second that succeeds), then paste in what new log lines are created. Interesting ones likely contain something like "GET /vod/2024-02/..." [these are the requests HA is making to your backend, I'm curious if both requests are being received at all].

woempiej commented 3 months ago
Incorrect

2024-02-17 19:07:10.406583420  172.30.32.1 - - [17/Feb/2024:20:07:10 +0100] "GET /vod/2024-02/17/17/frigate_cam1/utc/index.m3u8?authSig=eyJpc3MiOiI5ZDIyMGFhMDE1MDg0ZjA4ODY1N2QyNzlhODgyODJlZCIsInBhdGgiOiIvYXBpL2ZyaWdhdGUvZnJpZ2F0ZS92b2QvMjAyNC0wMi8xNy8xNy9mcmlnYXRlX3Zvb3JkZXVyL3V0.xdqLbji6dRNBNGdpv7xKCGwf8uvVfPH2a5SBzmbPqfM HTTP/1.1" 200 404 "http://LOCAL_IP_HA:8123/media-browser/browser/app%2Cmedia-source%3A%2F%2Ffrigate/video%2Cmedia-source%3A%2F%2Ffrigate%2Ffrigate%2Frecordings%2F%2F%2F/video%2Cmedia-source%3A%2F%2Ffrigate%2Ffrigate%2Frecordings%2Ffrigate_cam1%2F%2F/video%2Cmedia-source%3A%2F%2Ffrigate%2Ffrigate%2Frecordings%2Ffrigate_cam1%2F2024-02-17%2F" "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:122.0) Gecko/20100101 Firefox/122.0" "LOCAL_IP_BROWSER_DEVICE"

Correct

2024-02-17 19:04:21.550943472  172.30.32.1 - - [17/Feb/2024:20:04:21 +0100] "GET /vod/2024-02/17/17/frigate_cam1/utc/index.m3u8?authSig=eyJpc3MiOiIzYTJhMTJhZmQ2MjA0ZGU3ODU2Njk3NTIzNDQ2ZDI1ZSIsInBhdGgiOiIvYXBpL2ZyaWdhdGUvZnJpZ2F0ZS92b2QvMjAyNC0wMi8xNy8xNy9mcmlnYXRlX3Zvb3JkZXVyL3V0.5O6CkSE9f7mhpt9X8WCbfyarfi3eCn7obC-lvLUQxAo HTTP/1.1" 200 402 "http://LOCAL_IP_HA:8123/media-browser/browser/app%2Cmedia-source%3A%2F%2Ffrigate/video%2Cmedia-source%3A%2F%2Ffrigate%2Ffrigate%2Frecordings%2F%2F%2F/video%2Cmedia-source%3A%2F%2Ffrigate%2Ffrigate%2Frecordings%2Ffrigate_cam1%2F%2F/video%2Cmedia-source%3A%2F%2Ffrigate%2Ffrigate%2Frecordings%2Ffrigate_cam1%2F2024-02-17%2F" "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:122.0) Gecko/20100101 Firefox/122.0" "LOCAL_IP_BROWSER_DEVICE"
dermotduffy commented 3 months ago

Looks like both requests are served okay from the backends perspective (both http status 200), although the response sizes look small compared to my testing, but that could be a red herring.

@woempiej Do you get any messages in your Javascript console (press F12 in Chrome), when you attempt to play the video from the media browser?

woempiej commented 3 months ago

Regarding to: although the response sizes look small compared to my testing, but that could be a red herring

I cut some info (behind "authSig=") out of the string.

Here's the console output. Sorry for the Dutch language.

afbeelding

afbeelding

Tibladar commented 3 months ago

I can now confirm this issue and it's probably an HA issue.

It works fine with 2024.1.5 but is broken since 2024.2.0 with no other changes (same frigate and frigate-integration version)

Daniel-dev22 commented 3 months ago

I am having a similar issue to op.

When using this card configuration below I noticed with this setting snapshot_click_plays_clip whenever I click a snapshot regardless if it's the most recent snapshot it doesn't load the video for any camera I try on the first try after a fresh reload of the companion app page or fresh start after force stopping the app.

If I close the card and come back to the same snapshot or other snapshot or other camera and click on a snapshot then the video works. Then it also works for all cameras on the first try not just the one I was trying on initially. Something blocks the video from loading on a fresh start of the app/reload of the browser the first time.

I am using frigate card v5.2.0 on android 14

Frigate card config ```yaml type: vertical-stack cards: - type: custom:bubble-card card_type: pop-up hash: '#cameras' name: Cameras icon: mdi:cctv margin_top_mobile: 0px margin_top_desktop: 28px width_desktop: 75% - type: custom:frigate-card card_id: popup cameras_global: live_provider: go2rtc go2rtc: modes: - mse frigate: labels: - person cameras: - camera_entity: camera.doorbell - camera_entity: camera.outdoor_1 - camera_entity: camera.outdoor_2 - camera_entity: camera.outdoor_3 - camera_entity: camera.outdoor_4 - camera_entity: camera.outdoor_5 - camera_entity: camera.outdoor_6 - camera_entity: camera.outdoor_7 - camera_entity: camera.outdoor_8 - camera_entity: camera.outdoor_9 - camera_entity: camera.garage - camera_entity: camera.front_door_area - camera_entity: camera.dining_room_area - camera_entity: camera.laundry_room - camera_entity: camera.lower_level_walkway live: lazy_unload: hidden auto_play: all auto_mute: all auto_unmute: never controls: title: mode: none thumbnails: mode: below media: snapshots show_details: false builtin: false next_previous: style: none zoomable: true draggable: false auto_pause: all transition_effect: none display: mode: grid media_viewer: snapshot_click_plays_clip: true auto_unmute: selected controls: builtin: false title: mode: none thumbnails: mode: none next_previous: style: none view: timeout_seconds: 0 menu: style: outside position: bottom buttons: frigate: enabled: false snapshots: enabled: false download: enabled: false camera_ui: enabled: false fullscreen: enabled: true media_player: enabled: true microphone: enabled: true timeline: enabled: false cast: enabled: false play: enabled: true mute: enabled: true performance: profile: high overrides: - conditions: media_query: '(max-width: 300px)' overrides: menu: style: none media_viewer: controls: mode: none timeline: mode: none media_gallery: controls: mode: none live: controls: next_previous: style: none thumbnails: mode: none ```

This video is 2x sped up to get under 10mb so it can be uploaded.

https://github.com/dermotduffy/frigate-hass-card/assets/47092714/73063368-44cd-4cb0-a123-069c2ed52f2f

Edit:

I just noticed I see the same behavior with not loading Frigate clips the first time in the media browser.

PablaV commented 3 months ago

Anyone have any working solutions? I am experiencing the exact same issue as described above

Daniel-dev22 commented 3 months ago

Anyone have any working solutions? I am experiencing the exact same issue as described above

No working solutions. Appears to potentially be an ha media browser issue or frigate integration getting the data to the media browser? Just guesses.

Tibladar commented 3 months ago

Still an issue with 2024.2.4 - No workarounds other than downgrading to 2024.1.5

It's an issue in the HA frontend, see this issue with the same exception: https://github.com/home-assistant/frontend/issues/19799

woempiej commented 2 months ago

Hi all,

Issue is fixed in HA 2024.3.0

PablaV commented 2 months ago

Can confirm that 2024.3 has fixed this issue

Daniel-dev22 commented 2 months ago

Thank you @bramkragten for getting the fix in so fast.