Can't get the lovelace card to work or stream video, but there are no errors in the logs

[ajayjohn]

I have read literally every related bug on this repo as well as the parent aarlo repo. However, I am not able to get the lovelace card or live video streaming to work with the hass-aarlo component.

The cards always look like this on the UI.

I have enabled debug logs using the following in my configuration.yaml

    ffmpeg: debug
    custom_components.aarlo: debug
    custom_components.aarlo.camera: debug
    custom_components.aarlo.media_player: debug
    pyaarlo: debug

However, the Aarlo module throws absolutely no errors in the log. The rest of the features work perfectly and I am able to control camera states, playback previously recorded videos, track binary sensor changes and all the other features provided by Aarlo. It is just the live streaming part that does not work.

• FYI, I use two Arlo Pro 2 cameras and do not have any Arlo Q cameras. I have tried enabling and disabling the stream: component too, but to no avail.
• I am running HA using HassOS, which comes with ffmpeg built-in. I am able to stream my other http and rtsp based cameras with HA, without any issues.
• Lastly, I have TFA enabled for my Arlo cameras and have configured the imap feature of Aarlo beta to use it. It has worked quite well for me till now.

Could you please guide me on what I could be doing wrong?

[twrecked]

You cameras should stream, I have those type.

Did you add streaming to your config?

stream:

And can you paste on of the lovelace card configurations?

[ajayjohn]

Thanks for your prompt response! I do have the stream component enabled. Also, I am able to successfully stream these cameras using the stream.play_stream service.

However, the lovelace card fails to show any kind of thumbnail or stream. Here is the config from the raw config editor.

battery_id: sensor.entrance_camera_battery
entity: camera.entrance_camera
image_click: play
name: Entrance
show:
  - motion
  - sound
  - snapshot
  - battery_level
  - signal_strength
  - captured_today
top_date: false
top_status: false
top_title: false
type: 'custom:aarlo-glance'

[twrecked]

What browser/OS are you using to show the Lovelace streams? And what device are you using to for the camera.play_stream service?

One new thing to try is this. Arlo is moving away from flash and added a streaming server that uses mpeg-dash, I modified the Lovelace card to support it.

[ajayjohn]

@twrecked I tried the new parameters, but unfortunately it didn't change anything for me :(

I have tried the Lovelace streams on the latest Chrome browser (On Mac), Safari (On Mac) as well as the Brave browser (A Chromium fork on Android). I have even tried this on different laptops (My office Mac, with Chrome). All of them show the same broken image on the Lovelace page, while being able to successfully do a camera.play_stream without any issues. If it helps, I run HassOS on an Intel NUC as a virtual server running on Proxmox. The stream itself was casted to a Google Home Hub Display.

Also, just to add anything more that can reveal the issue, here is the HTML output for the lovelace card on my browser. There are no errors shown in the console section of the browser.

<div id="aarlo-wrapper" class="base-16x9">
                <video class="hidden video-16x9" id="stream-camera.aarlo_camera.entrance_camera" poster="undefined">
                        Your browser does not support the video tag.
                </video>
                <video autoplay="" playsinline="" class="hidden video-16x9" id="video-camera.aarlo_camera.entrance_camera" src="undefined" type="undefined" poster="undefined">
                        Your browser does not support the video tag.
                </video>
                <img class="hidden img-16x9" id="image-camera.aarlo_camera.entrance_camera" src="undefined" alt="undefined" title="undefined">

                <div class="hidden img-16x9">
                    <div class="lrow">
                        <div class="lcolumn">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                        </div>
                        <div class="lcolumn">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                        </div>
                        <div class="lcolumn">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                            <img class="hidden library-16x9" src="/static/images/image-broken.svg" alt="" title="">
                        </div>
                    </div>
                </div>
                <div style="height: 100px" id="brokenImage" class="undefined img-16x9"></div>
            </div>

[ajayjohn]

@twrecked Whenever you get a chance to look at this issue, if you find that you need more logs/details about my config, just let me know. I did some more troubleshooting recently, but couldn't figure out what could be going wrong. The issue doesn't seem to browser or OS specific.

[twrecked]

Do you rename your entities because I think your entity value might be wrong. All my cameras start with camera.aarlo_. Can you try the following? Or double check the id against the entities on the Developer Tools >> States tab.

entity: camera.aarlo_entrance_camera
image_click: play
name: Entrance
show:
  - motion
  - sound
  - snapshot
  - battery_level
  - signal_strength
  - captured_today
top_date: false
top_status: false
top_title: false
type: 'custom:aarlo-glance'

If that doesn't work I'll add some debug to the Lovelace card and we can try that.

[ajayjohn]

@twrecked I did change the default entity names generated by Aarlo. Here is a screenshot of my States entry. I removed the 'aarlo_' prefix from all my camera entity ids.

[twrecked]

This we can fix. Can you try replacing entity with camera_id:

battery_id: sensor.entrance_camera_battery
camera_id: camera.entrance_camera
image_click: play
name: Entrance
show:
  - motion
  - sound
  - snapshot
  - battery_level
  - signal_strength
  - captured_today
top_date: false
top_status: false
top_title: false
type: 'custom:aarlo-glance'

Also; you might want to define these too.

motion_id
sound_id
signal_id
capture_id
last_id

And I'll think of a way of making this more generic.

[twrecked]

I just created a new release - v 0.1.3 that should work with your original configuration.

[ajayjohn]

v0.1.3 and the new config made the card show up perfectly! I can't believe you made these changes and even updated the documentation so soon! Thank you so much for fixing this issue.

BTW, all attributes of the camera work fine now, in addition to the snapshot showing up, however, the streaming part still doesn't work. The camera goes into streaming mode and I even get the streaming UI with a stop button. However, the video perpetually has a spinner on top of it and it doesn't play. In contrast, if I click on any video in the last captured videos list, it plays perfectly within the card.

Edit: Also wanted to add that the streaming URL shows up correctly in the HA logs and streaming to a cast display using the stream component works perfectly too. Also, the camera does the get updated with a streaming status. Its just that the video won't play. 2020-07-28 23:27:23 DEBUG (SyncWorker_2) [pyaarlo] url=xxxxxx

[twrecked]

I have Arlo Pro 2 and streaming should work. You can try direct streaming and see if that helps - see here.

What browser/OS have you tried?

[ajayjohn]

LOL, it was quite the opposite. I had already gone through the issue you had linked and added the user_agent: linux parameter a few days back, while I was troubleshooting my lovelace card issues. Going back and removing that option made streaming work perfectly for me. I'm finally able to use the lovelace card and all its features.

Thank you for patiently helping me out :)

[twrecked]

No worries and glad it's working now.