Saving and Displaying an Image With Driver?

🚧 Developers Coding Questions
1

I have done a bunch of searching in the forum and online and so far the answer is negative (especially considering the possible variable types) but I wanted to ask to be sure.

Is there any way to have a driver receive an image (from an httpget for example) and store/display that image? I am NOT talking about the URL of an image, but the actual jpg data itself.

As some might have noticed I have started working on a driver for the Blink camera API. The API allows receiving jpg image data from the cameras, however only as the image. While you can see the URL and request it, each request requires an auth-token in the header. Easy enough to do in groovy, but it cannot be included in the URL itself (from what I have found online so far) so you cannot just pass a URL (that builds in the header with auth-token) to an attribute for the dashboard.

So these leads to 2 possibilities as I understand it (please add more if you have ideas):

  1. Is there a way to save/display the image data the driver receives?
  2. Is there a way to encode header data into a URL so the URL includes the header (specifically the auth-token data) and the receiving server treats it as the header data, not just a really long URL (which would fail)?
1 Like
2

@JustinL may have ideas. He worked with a bunch of image rendering options for his Conditional Image Server app.

1 Like
3

I saw that but it appeared to me that you load the images in. Not possible to preload them obviously (since they are generated as needed) but you are right about queuing an expert in. Thanks!

4

Could you store the file in the local file area of the hub and then display it with html in attribute?

5

At this time (maybe it will change) the local file area is only accessible to Rules (which would imply apps in my mind in the future). No indications for Drivers yet. If it was, I think that might be a possibility.

6

ah my bad. I kind of assumed an app would go with this. I believe the smartly folks have figured a way to use the rm api to access the local file storage? A little roundabout but..
i Could be wrong though as well.

7

I might need clarification on what you are trying to do ultimately. Are you just wanting to have the image as an attribute so you can display it on a dashboard? Why do you need to save the image?

8

@JustinL:
Ultimately I would like the image to be displayed on the Dashboard (and on the Child's driver page if possible).

Saving it is because I do not think the normal image method (providing a URL to the image) will work because of the auth-token needed in the header request. Without it you cannot get the image.

Edit:
For example, I tried putting just the URL in my browser and it gets an Unauthorized error page.

9
  1. retrieve the image with the auth token and render at a cloud endpoint similar to the Conditional Image Server app
  2. Reference the endpoint with html in an attribute. Add a ?ver=1 to the endpoint url and increment each time you update the attribute, so the update refreshes the attribute value.

I think I do something similar in the Multi-Place app.

1 Like
10

@JustinL:
Just to test my understanding... This sounds like a bit of a workaround. Get the file but have it actually store/render in a cloud solution of some sort then put the resulting URL (which would be public) into the Dashboard?

My biggest worries about that are:

  1. Relies on another external system.
  2. The images would be publicly accessible on that cloud site. Obscure most likely, but still accessible. Not sure how users would feel about that since these cameras also include indoor models that people can use to monitor rooms.

If there is no way to do this directly, I guess it is a workaround. I think I will also push for local file access to be expanded so images could be stored there and accessed easily.

11

Sort of but

  1. There is no external system, only the hub itself
  2. You can render at a local endpoint or a cloud endpoint

Take a look at Conditional Image Server and you will see how to do it

1 Like
12

@JustinL
I will have to take a look. To be honest I do not "get it" but that is just me. I will take a closer look at your app when I get home tonight and see if I can understand and get something working for the Blink driver.
Thanks!

2 Likes
13

Maybe this will help:

  • when you update the value of an attribute. the dashboard refreshes the view of that attribute
  • so updating the attribute value of an attribute that has a url to your local endpoint will call the function mapped to your local endpoint
  • within the function mapped to your endpoint, retrieve the image with the auth token and render the image as the last line in the function (to effectively return the image to the function call at the endpoint)
  • update the attribute value (by incrementing the ?ver=1) however often you want the image to be refreshed

But yeah look at the other app and let me know if that clears it up

3 Likes
14

@JustinL:
I tried copying the "getImage" function into my driver (replacing the URL info with the state variable containing it, and "hard coding" things like the fact it is a jpeg) but I get an error with the render not being a recognized command. Is that something that only works for apps? I tried searching around the forum but I got a lot of results for render... that did not seem the least bit related.

If I use a simpler "return imageBytes" instead, a variable can use it just fine as a giant list of bytes, but obviously that does not make a visible image.

I tried out conditional image server itself just to see if that would help me understand how it works. I got an image from my own webserver to display in the dashboard as a result but I really did not "get it" unfortunately. Will be trying some more over the next few days.

2 Likes