I’d like to display local images on the server in a xojo web program: where should I place them, and what path should I use to get the webpicture?
In Run mode and in compiled mode.
Thanks.
You have to serve the files somehow.
If you use Lifeboat you can offload the file serving to nginx, which is a much better file server than Xojo (and the recommended route by the developers who built the framework). Here, you’d use the URL configured by Lifeboat.
You can also write a routine in HandleURL to serve the images. You would then use the path to whatever that HandleURL function is going to expect. Note that the framework was not built to handle this well, and that time serving images is time taken away from every other session.
1 Like
You can load it from anywhere you want and use the Picture.Open to return and convert it to a WebPicture. This shows a test using your Home folder.
Var MyPicture As WebPicture
Var pictfile As FolderItem
pictfile=SpecialFolder.UserHome.Child("test.png")
MyPicture=Picture.Open(pictfile) 'picture converts to webpicture
ImageViewer1.DisplayMode=WebImageViewer.DisplayModes.ScaleAspectFit
ImageViewer1.Picture=MyPicture
ImageViewer1.Visible=TrueI see people copying the images into Resources folder.
SpecialFolder.Resources.Child(…)
You can go ahead and create a WebPicture the way @Richard_White describes.
The only thing to mention is, if you want to allow the user to download that image by requesting its WebPicture.URL, then you’ll have to keep an instance somewhere. Otherwise, the URL won’t work anymore as soon as the WebPicture instance goes out of scope.
Here is a little sample project:
webpicture-sample.zip (202.4 KB)
Thanks, I understand how it works. The WebPicture displays fine, and I’ll look into LifeBoat.
But my goal is to use a WebListBoxImageRenderer, and I can’t get the image to display in a cell.
Oh then you definitely need to keep a reference to the WebPicture around…
Have you looked at the example that ships with Xojo?
Note: for me the images are missing, but adding some images it works:
This works (from the Xojo example):
Me.AddRow(“”)
Var pic As New WebListBoxImageRenderer
pic.URL = “https://www.publicdomainpictures.net/pictures/120000/nahled/small-waterfall-in-forest.jpg”
Me.CellTextAt(1,0) = pic
but not this:
Var pictureFile As FolderItem = SpecialFolder.Resource(“example.jpg”)
var mpic as WebPicture
mPic = Picture.Open(pictureFile)
mPic.MIMEType = “image/jpeg”
Me.AddRow(“”)
Var pic As New WebListBoxImageRenderer
pic.URL = mPic.URL
Me.CellTextAt(1,0) = pic
Can you give more information about it? How doesn’t work? Do you get an error? or simply the page renders without the picture?
The WebPicture is going out of scope, as was mentioned. It needs to be a property that stays around for as long as you need the user to be able to see the image.
2 Likes
zPic is a Property of the WebPage
Var pictureFile As FolderItem = SpecialFolder.Resource(“example.jpg”)
zPic = Picture.Open(pictureFile)
Me.AddRow(“”)
Var pic As New WebListBoxImageRenderer
pic.URL = zPic.URL
Me.CellTextAt(1,0) = pic
–> It doesn’t work either (the page renders without the picture)
Can you create a sample project, zip it and upload on a post?
Someone will review and give you a better idea to solve the problem.
Maybe the problem is that you need Me.CellRendererAt instead?
What version of Xojo are you using?
I use the last version 2025r21
The project:
WebCellPic.zip (202.8 KB)
displays no image
'Me.AddRow(“”)
'Var pictureFile As FolderItem = SpecialFolder.Resource(“example.jpg”)
'zPic = Picture.Open(pictureFile)
'Var pic As New WebListBoxImageRenderer
'pic.URL = zPic.URL
'Me.CellRendererAt(0,0) = pic
displays the image
Me.AddRow(“”)
Var pic2 As New WebListBoxImageRenderer
pic2.URL = “https://www.publicdomainpictures.net/pictures/120000/nahled/small-waterfall-in-forest.jpg”
Me.CellRendererAt(1, 0) = pic2
Filed a ticket for you. #79912 - WebPicture.Open on a non-existent FolderItem isn’t raising a RuntimeException
There isn’t anything in this project that adds the image to the SpecialFolder.Resources location. The FolderItem path has to actually exist and right now it’s silently failing.
You can resolve this in the demo project by adding a CopyFiles step which puts the image in Resources. But I didn’t get the feeling you were looking for a CopyFiles step from the initial post.
I guessed that the problem was because the image was not copied to the Resources folder.
And didn’t know that picture.open doesn’t fail with error code 2.
A sample project that I was creating was close to what you did, but instead of:
Var pictureFile As FolderItem = SpecialFolder.Resource(“example.jpg”)
zPic = Picture.Open(pictureFile)
I used something like:
zPic = new WebPicture(SpecialFolder.Resource("example.jpg"))
that is basically the same but with that line of code I get an Exception
Thank you Tim for reviewing the code and opening the bug report.
Not sure if you need help with the CopyFiles step that Tim mentions.
Edit: your image gives me UnsupportedFormatException, I’m working on a Mac. Using ImageOptim to reduce the file size fix the problem:
Yes, I also managed to display the image, without an UnsupportedFormatException (I’m also on a Mac).
Tim, can LifeBoat prevent this kind of copying?
With Lifeboat, you would upload your static files to your server in some other way (within Lifeboat or with a SFTP program). Lifeboat configures nginx to serve files from that folder as a normal website, so you would use the URL you configure in Lifeboat to access the image.
This offloads image serving from the Xojo Web app which will help performance. The downside is that debug runs will require internet connection to load the images. If you’re serving many or large images, offloading from the Xojo Web app is the best for user experience.
I don’t have any videos on setting up static files, but Lifeboat is free to try and I’m here to help if you get stuck.
1 Like
Thanks Tim.
Actually, my copyfile problem only occurs in debug mode: in compiled mode, I place the files in the Resources folder.
I would have liked to find a web address for all the files on the server computer, given that the program will run on them… like file:///Users/… or http://localhost/Users…