# Ignition Perspective - impossibile to display image

**URL:** <https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427>\
**Category:** Ignition\
**Tags:** ignition81, perspective, scripting, database\
**Created:** [January 27, 2025, 1:39pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427 "2025-01-27T13:39:37Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![davee\_s](https://avatars.discourse-cdn.com/v4/letter/d/e47774/32.png) [@davee\_s](https://forum.inductiveautomation.com/u/davee_s)\
**Post date:** [January 27, 2025, 1:39pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/1 "2025-01-27T13:39:37Z")

</div>

Hello guys,  
I am using Ignition 8.1.45 with Perspective module.

I want to create a form that store an image into a MySQL blob field. I created a view and a NamedQuery to insert the image (by an upload file component), query is ok and data is inserted in the table.

 ![Screenshot 2025-01-27 143203](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/2/728cb4610a7babba35e51eb5acf6102e66141fdd.png)

When trying to display in an image component is impossible to show the image.  
I created a view with image component, a NamedQuery that returns the data from the database table and then a transform script that convert to base64 the data.

 ![Screenshot 2025-01-27 143217](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/0/108e2387e0b73acab2fd95f85abe988c55e776a9.png)

 ![Screenshot 2025-01-27 143413](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/1/81d8096dfc121edfd6e3df8112c25a8fe3525bc9.png)

Tried also to change the query to convert the image to base64 without using the transform but didn't work

---

<div class="post-metadata">

**Author:** ![dkhayes117](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dkhayes117/32/68344_2.png) [@dkhayes117](https://forum.inductiveautomation.com/u/dkhayes117)\
**Post date:** [January 27, 2025, 2:19pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/2 "2025-01-27T14:19:30Z")

</div>

You need to install Phil's [Blob Server Module](https://forum.inductiveautomation.com/t/automation-professionals-blob-server-module/57970) or use the WebDev module. The blob server module is free, so I would go with that one, but if you have restrictions of 3rd party modules, go with webdev.

---

<div class="post-metadata">

**Author:** ![davee\_s](https://avatars.discourse-cdn.com/v4/letter/d/e47774/32.png) [@davee\_s](https://forum.inductiveautomation.com/u/davee_s)\
**Post date:** [January 27, 2025, 2:21pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/3 "2025-01-27T14:21:38Z")

</div>

Hello @dkhayes117, we can't pruchase in this stage webdev module so I am trying to do on my own. Is [Blob Server Module](https://forum.inductiveautomation.com/t/automation-professionals-blob-server-module/57970) not using webdev module to works?

---

<div class="post-metadata">

**Author:** ![dkhayes117](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dkhayes117/32/68344_2.png) [@dkhayes117](https://forum.inductiveautomation.com/u/dkhayes117)\
**Post date:** [January 27, 2025, 2:25pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/4 "2025-01-27T14:25:04Z")

</div>

The WebDev module is _ **not** _ required for the blob server module to work, and it is free.

---

<div class="post-metadata">

**Author:** ![Chris\_Bingham](https://avatars.discourse-cdn.com/v4/letter/c/e5b9ba/32.png) [@Chris\_Bingham](https://forum.inductiveautomation.com/u/Chris_Bingham)\
**Post date:** [January 27, 2025, 3:26pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/5 "2025-01-27T15:26:56Z")

</div>

Seems odd that you would need anything additional for this.  
If you embed the same image directly to a Perspective view, then inspect the `source` property of the Image object, is there any difference between the value there and the result of your transform?

---

<div class="post-metadata">

**Author:** ![Chris\_Bingham](https://avatars.discourse-cdn.com/v4/letter/c/e5b9ba/32.png) [@Chris\_Bingham](https://forum.inductiveautomation.com/u/Chris_Bingham)\
**Post date:** [January 27, 2025, 3:58pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/6 "2025-01-27T15:58:16Z")

</div>

To elaborate, within the Perspective Upload component, I'm able to obtain the same Base64 encoding via the following script @ onFileReceived:

```python
import base64
data = base64.b64encode(event.file.getBytes())
system.perspective.download(filename="base64.txt", data=data)

```

---

<div class="post-metadata">

**Author:** ![davee\_s](https://avatars.discourse-cdn.com/v4/letter/d/e47774/32.png) [@davee\_s](https://forum.inductiveautomation.com/u/davee_s)\
**Post date:** [January 28, 2025, 9:31am UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/7 "2025-01-28T09:31:21Z")

</div>

Hello @Chris_Bingham added the b64encode before insert the image into SQL table.  
This is the result when trying to display image

 ![Screenshot 2025-01-28 103001](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/a/4abee5f2b6efdc15e92c259d6a21a0d74975f674.png)  
As you can see seems that the source is correct but no image is displayed. Keep in mind I have tested with a .png, maybe is this the problem?

---

<div class="post-metadata">

**Author:** ![Chris\_Bingham](https://avatars.discourse-cdn.com/v4/letter/c/e5b9ba/32.png) [@Chris\_Bingham](https://forum.inductiveautomation.com/u/Chris_Bingham)\
**Post date:** [January 28, 2025, 9:44am UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/8 "2025-01-28T09:44:35Z")

</div>

PNG should also work.  
Though, you might try changing your expression to concatenate "data:image/png..."?

---

<div class="post-metadata">

**Author:** ![davee\_s](https://avatars.discourse-cdn.com/v4/letter/d/e47774/32.png) [@davee\_s](https://forum.inductiveautomation.com/u/davee_s)\
**Post date:** [January 28, 2025, 9:45am UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/9 "2025-01-28T09:45:37Z")

</div>

Solved using @pturmel Blob Server [https://forum.inductiveautomation.com/t/automation-professionals-blob-server-module](https://forum.inductiveautomation.com/t/automation-professionals-blob-server-module)

---

<div class="post-metadata">

**Author:** ![Kevin.Herron](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kevin.herron/32/7259_2.png) [@Kevin.Herron](https://forum.inductiveautomation.com/u/Kevin.Herron)\
**Post date:** [January 28, 2025, 1:46pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/10 "2025-01-28T13:46:50Z")

</div>

You say you stored a PNG but your content type is specified as “image/ jpeg”.

Have you tried “image/png” if that’s what the images are actually encoded as?

Edit: oops, as @Chris_Bingham just suggested

---

<div class="post-metadata">

**Author:** ![davee\_s](https://avatars.discourse-cdn.com/v4/letter/d/e47774/32.png) [@davee\_s](https://forum.inductiveautomation.com/u/davee_s)\
**Post date:** [January 28, 2025, 1:50pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/11 "2025-01-28T13:50:38Z")

</div>

Yes I tried but didn't work with previous approach.  
Now with Pturmel Blob Server works but I have another problem.  
Seems that saving a photo taken from smartphone camera from Ignition Perspective app with 4Mb or more crashes Gateway. Is it possible that passing all ArrayBuffer to the NamedQuery is too much data?

---

<div class="post-metadata">

**Author:** ![Kevin.Herron](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kevin.herron/32/7259_2.png) [@Kevin.Herron](https://forum.inductiveautomation.com/u/Kevin.Herron)\
**Post date:** [January 28, 2025, 1:52pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/12 "2025-01-28T13:52:21Z")

</div>

> [@davee\_s](#):
>
> Is it possible that passing all ArrayBuffer to the NamedQuery is too much data?

Yes, very possible.

Hosting anything but small images should not be done via database.

---

<div class="post-metadata">

**Author:** ![michael.flagler](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/michael.flagler/32/26272_2.png) [@michael.flagler](https://forum.inductiveautomation.com/u/michael.flagler)\
**Post date:** [January 28, 2025, 1:54pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/13 "2025-01-28T13:54:28Z")

</div>

> [@Kevin.Herron](#):
>
> Hosting anything but small images should not be done via database.

Yep, if you need to store larger images, store them on a filesystem somewhere accessible from Ignition, then store a path or something in the DB to point to the actual file on the filesystem. This keeps the database smaller, and files are easier to manage.

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [January 28, 2025, 1:54pm UTC](https://forum.inductiveautomation.com/t/ignition-perspective-impossibile-to-display-image/101427/14 "2025-01-28T13:54:30Z")

</div>

> [@Kevin.Herron](#):
>
> but small images should not be done via database

Concur. NQ query caching can get you in trouble with RAM consumption, in particular.
