Loading images from local binary list in web

Loading images from local binary list in web

  

In mobile when populating the images widget I can use a local binary variable, say a row in a list with binary entities in it.

This is useful because while I am using databases for most things, I am putting large (being large) in AWS. I have server actions able to return structures with the right binaries which do all the chatting to AWS.

I am trying to replicate my mobile app in web. I create a preparation step for the block which makes a local variable, a list of image structures containing the binaries.

However, in the image widget I can only choose the 'Attribute' from server database items. My binaries aren't in one. I really don't want to use a database for multi-megabyte binaries, especially after going to some lengths to get the AWS syncing working.

Am I missing something?

At the moment I'm thinking I may need to either create my own widget able to look at the binaries in local variables, or perhaps I need to create a database table which can hold just a few images for just long enough for me to load from them.

My images would be best not publically available, so I don't want to create public links to them, I could maybe do so temporarily, will rack up the AWS calls, but they are pretty cheap.

Any other suggestions welcome!

Solution

Hello Dan,

One option would be to get your images from AWS and convert to Base64, passing it dynamically to the IMAGE source through a variable, that would be set to External Image, and refreshed. 

Another option would be to create a page that would receive some kind of identifier as input parameter and in the preparation would take the image from AWS and finish the preparation with a download of the binary. The image widget would be set to External and the source point to your page.

Those two are the ones that I can remember that I think will work (the later I tested already).

Cheers,
Eduardo Jauch

Solution

Drats, I can't believe I asked a question, got two great answers but was too busy then working on other bits of the app to notice the answers!

Problem with not noticing is that I need a bit of clarification and you may now not be online.

1) the images are already base64 in AWS, the passing to the source through a variable set to external - this bit I don't quite understand, sorry. So I would point the widget at a variable set to the url of a variable containing the binary? I didn't know I could access a variable's contents via a url. Maybe I'm misunderstanding. I'll read in the outsystems docs and see if I can figure that one out.

2) you say you've tested this sounds good, but again im a bit unclear. I think I understand almost all apart from the finishing of the preparation - can I (in a prep) somehow set the whole page to just be the result of a binary?

Thanks so much for your help Eduardo. Just in case it's of help to anyone else: I did already come up with a solution albeit a very very bad solution. I created a database entity into which I put the binaries from AWS on demand, I then load from that, and I later clear down any rows in that entity more than a few seconds old. It is sadly incredibly slow because the files are getting pulled from AWS to outsystems and then to the client and both stages have to be done on demand and prior to anything being displayed.

I think your first method might be as quick as I can get as I suspect outsystem's servers have very fast API access to AWS and then as the load will be from a url it might be asynchronous with the rest of the page. My other option I think might have to be to open up the permissions on the images is AWS, or write javascript to do some api access from the client.

Right - I figured out the second method. When you wrote "with a download of the binary" you really did mean 'download' as in use a download method. So I've implimented that and I think it might just be the best way of doing this as it allows the images to load in their own good time after the rest of the page is usable.

Thanks Eduardo - again, incredibly helpful and cunning!

Eduardo Jauch wrote:

Hello Dan,

One option would be to get your images from AWS and convert to Base64, passing it dynamically to the IMAGE source through a variable, that would be set to External Image, and refreshed. 

Another option would be to create a page that would receive some kind of identifier as input parameter and in the preparation would take the image from AWS and finish the preparation with a download of the binary. The image widget would be set to External and the source point to your page.

Those two are the ones that I can remember that I think will work (the later I tested already).

Cheers,
Eduardo Jauch

Just replying specifically to this one as the second option was the way to go and worked very well.

Thanks again!


Nice :)