Update Picture Image URL From Template Updated From Rest Sensor

Configuration
,
1

Hello! I have the following configuration:
This rest sensor gets a value from an API that will be used as the index value needed for an image URL:

sensor:
  - platform: rest
    name: "History Index"
    resource: "http://192.168.1.199:1888/v2/api/image-history?count=true"
    method: GET
    value_template: "{{ value_json.Response}}"
    scan_interval: 30

Thes template uses the rest sensor to construct an image URL used as the path to latest image with the dynamic image index added to path, obtained from the rest sensor:

template:
  - sensor:
      - name: "Latest Image"
        state: "http://192.168.1.199:1888/v2/api/image/thumbnail/{{ states('sensor.history_index') | int }}"

The result of the following in the Template tab of developer tools is:
{{ states("sensor.latest_image") | string }}

Screenshot 2025-04-09 at 10.47.42 AM
Screenshot 2025-04-09 at 10.47.42 AM504×230 7.46 KB

I am attempting to get this path into a picture card, unsuccessfully, using the states template syntax. It appears that is null once used within the card.
Anyone have experience with something similar?
Thanks in advance!

2

Make an image template entity, not a sensor template entity.

3

Hi @petro thanks so much! I spent a good deal of time trying to sort that out but I didn’t have any success. I would certainly be appreciative if you might provide some additional details. I went through every doc and example in forum I could find.
Currently, I have reverted back to a sensor:

  - sensor:
      - name: "Latest Image"
        unique_id: latest_image
        state: >
          http://192.168.1.199:1888/v2/api/image/thumbnail/{{ states('sensor.history_index') | int }}

In the UI I installed config-template-card and am having some limited success with this:

type: custom:config-template-card
entities:
  - sensor.latest_mage
card:
  type: picture
  image: ${states["sensor.latest_image"].state}

What I am finding is that when a new image completes the UI briefly displays the image but then flashes to missing image icon. I’m not sure what this is indicating.
Cheers!
Doug

4

Always consult the documentation

Docs:

image
image940×343 35.2 KB

Notice the image and url and verify_ssl key?

  - image:
      - name: "Latest Image"
        unique_id: latest_image
        verify_ssl: False
        url: >
          http://192.168.1.199:1888/v2/api/image/thumbnail/{{ states('sensor.history_index') | int }}
5

Yep, I updated back to an image template:

  - image:
      - name: "Latest Image"
        unique_id: latest_image
        url: >
          http://192.168.1.199:1888/v2/api/image/thumbnail/{{ states('sensor.history_index') | int }}

Because the logs indicated:

Logger: homeassistant.components.image
Source: components/image/__init__.py:238
integration: Image (documentation, issues)
First occurred: 8:18:31 PM (11 occurrences)
Last logged: 8:20:55 PM

image.latest_image: Image from http://192.168.1.199:1888/v2/api/image/thumbnail/2 has invalid content type: application/json; charset=utf-8
image.latest_image: Image from http://192.168.1.199:1888/v2/api/image/thumbnail/3 has invalid content type: application/json; charset=utf-8

This was a result of trying to use the state property instead of URL property.
I updated to uss URL as I have above.
The API returns a .jpg file. The header in Postman is image/jpg; charset=utf-8
I think I saw somewhere that HA is expecting image/jpeg would that MIME type difference be an issue?
Also, this is not on SSL, it an http endpoint on local network.

6

I’ve added verify_ssl: false to the image template. Testing

7

Getting

Logger: homeassistant.components.image
Source: components/image/__init__.py:238
integration: Image (documentation, issues)
First occurred: 8:44:49 PM (2 occurrences)
Last logged: 8:44:51 PM

image.latest_image: Image from http://192.168.1.199:1888/v2/api/image/thumbnail/3 has invalid content type: application/json; charset=utf-8

This raised the flag I needed. The API index is 0 based and I need to subtract 1 from it. When the index does not exist it returns a JSON object. This works now:
http://192.168.1.199:1888/v2/api/image/thumbnail/{{ (states('sensor.history_index') | int) - 1 }}