# Upload file to an image component in perspective **URL:** \ **Category:** Ignition\ **Tags:** perspective\ **Created:** [July 17, 2024, 9:01am UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320 "2024-07-17T09:01:12Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![Joachim\_Govender](https://avatars.discourse-cdn.com/v4/letter/j/ed8c4c/32.png) [@Joachim\_Govender](https://forum.inductiveautomation.com/u/Joachim_Govender)\ **Post date:** [July 17, 2024, 9:01am UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/1 "2024-07-17T09:01:12Z")
Hi All, Please assist is it possible to use the upload file component to upload an image into an image component in perspective ? Thanks for your assistance ---
**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:** [July 17, 2024, 12:09pm UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/2 "2024-07-17T12:09:29Z")
Yes. The image component needs a URL pointing at the image file, so you have to either transform the image file bytes into a Data URL (base64 encoding, basically), or store the image file content in a place Ignition can reach to feed it back to the image component in your browser. For the latter approach, the WebDev module is the canonical solution. If you want to avoid spending those $$, and you can use a database to hold images as blobs, you might find my Blob Server module helpful. > [@Automation Professionals' Blob Server Module](https://forum.inductiveautomation.com/t/automation-professionals-blob-server-module/57970): > > Automation Professionals is pleased to announce an alpha release of its new Blob Server Module. Available only for Ignition v8.1, here. The Blob Server Module provides a simple way to deliver images, PDF files, or other binary content from a database to your Perspective clients or other web applications. Without needing the WebDev module. All you need is a Named Query that has appropriate security settings and returns a single row with two columns: Content, and ContentType. Modest documentati… ---
**Author:** ![Joachim\_Govender](https://avatars.discourse-cdn.com/v4/letter/j/ed8c4c/32.png) [@Joachim\_Govender](https://forum.inductiveautomation.com/u/Joachim_Govender)\ **Post date:** [July 17, 2024, 12:42pm UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/3 "2024-07-17T12:42:08Z")
I have the Web Dev module, please elaborate ---
**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:** [July 17, 2024, 12:47pm UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/4 "2024-07-17T12:47:41Z")
In the upload component's file received event, you would save the file to a specific folder in the gateway, probably assigning a pseudo-random file name to it. You would then send that file name to the image component (message, session prop, whatever) where it would be incorporated in a WebDev URL. The WebDev module would have a `doGet()` method that can deliver that content. You probably would want to use a database to hold metadata about uploads, tying original filename, upload user, timestamp, et cetera, to the generated file name. What to include depends on what you intend to **do** with these uploaded images. ---
**Author:** ![Joachim\_Govender](https://avatars.discourse-cdn.com/v4/letter/j/ed8c4c/32.png) [@Joachim\_Govender](https://forum.inductiveautomation.com/u/Joachim_Govender)\ **Post date:** [July 17, 2024, 12:52pm UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/5 "2024-07-17T12:52:45Z")
Its basically a Work Instruction that was converted to a gif. I want to avoid the engineers coming to me every time they change the instruction, so i want to make a view that allows them to upload the gif or pdf and displays it . ---
**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:** [July 17, 2024, 12:59pm UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/6 "2024-07-17T12:59:07Z")
Makes sense. The meta data should include a reference to the applicable process. Or the primary key for the image/pdf should be attached to the process information elsewhere in your DB. (I would probably favor DB blob storage instead of file storage--no need to create random file names if the DB makes a unique primary key automatically.) ---
**Author:** ![Joachim\_Govender](https://avatars.discourse-cdn.com/v4/letter/j/ed8c4c/32.png) [@Joachim\_Govender](https://forum.inductiveautomation.com/u/Joachim_Govender)\ **Post date:** [July 18, 2024, 5:38am UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/7 "2024-07-18T05:38:33Z")
Could you please provide me more info on how i would be able to achieve what i want to do, by your suggestion. Maybe like a guide or something ---
**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:** [July 18, 2024, 12:51pm UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/8 "2024-07-18T12:51:07Z")
I haven't had to do this myself, yet, in spite of being the author of the Blob Server module. There are many examples and variations scattered around on this forum. ---
**Author:** ![Eugene49](https://avatars.discourse-cdn.com/v4/letter/e/c6cbf5/32.png) [@Eugene49](https://forum.inductiveautomation.com/u/Eugene49)\ **Post date:** [July 27, 2024, 4:54am UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/9 "2024-07-27T04:54:09Z")
I am on the same boat right now.. I need perspective to store uploaded image somewhere, then be able to retrieve it and feed to a image component. I must try both options.. 🙂 go go go.! ---
**Author:** ![Eugene49](https://avatars.discourse-cdn.com/v4/letter/e/c6cbf5/32.png) [@Eugene49](https://forum.inductiveautomation.com/u/Eugene49)\ **Post date:** [July 27, 2024, 5:21am UTC](https://forum.inductiveautomation.com/t/upload-file-to-an-image-component-in-perspective/93320/10 "2024-07-27T05:21:23Z")
Using webdev. I am new to webdev, also cannot find how-to resource. I created a mounted Folder: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/1/f1ec18a64397dabd887d4c97a1d3b45284bd29d9.png) I also prepared my Upload Component: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/8/5861bc23e250c71cd9fe447c0d4ec2b0f5504ce6.png) Then what? ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/c/ac1c3c4484e32b89c6d7c8598b7284f80bd9fa87.png) Edit: Ohhh, I think I know where I am going.. on `onFileReceived` event. The below did not work.. What should be the path to the mounted folder: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/3/830cf29a89e71e2ec1821272e250def80e6b7ace.png)