Retrieving picture in XData service response

BIZ TMS XData
1

On XDataServer side I have the following service

type
TCustomerItem = class
public
customer_id: string;
lastname: string;
firstname: string;
middlename: string;
nameext: string;
dob: string;
end;

TCustomerList = class
public
count: integer;
returned: integer;
data: TList;
end;

[ServiceContract]
ICustomerService = interface(IInvokable)
['{88B77CE4-3E33-444F-9E77-E55BDC1F4DCC}']
// By default, any service operation responds to (is invoked by) a POST request from the client.
function SearchCustomer(searchStr: string): TCustomerList;
end;

The XDataServer implementation for SearchCustomer parses out the searchStr then runs a query that retrieves the data from the database. It then iterates through the query data and builds the TCustomerList response.

On the Web Core client side I retrieve the data using an XDataWebClient, load the data in an XDataWebDataClient then display the data using WebDBTableControl. This was all based on the XData music demo. And it is all working well.

I would like to add a thumbnail picture to the TCustomerItem object and display that in the WebDBTableControl. I have already tested loading the images in the grid by using the WebDBTableControlGetCellChildren event and creating a WebImageControl in the cell and loading the image using the URL property. That worked as well.

But the images are stored on a remote ftp server and I don't have direct access to the images directories. I think a good option would be to add a picture field to the TCustomerItem object, retrieve the pictures using ftp, base64 encode them, load them in the TCustomerItem object and return the pictures as part of the TCustomerList response.

Is that a good solution or do you recommend some other option? Can you point me in the right direction on how to get the pictures into the SearchCustomer Response and how to load that in the WebDBTableControl on the client side.

Thank you very much,

Elias Sarraf

2

At a high level, if you're already able to load images into the grid using a URL property, it might be best to include the URL in the TCustomerList response and have the grid load the images itself. There are a few reasons for this.

  1. Your service operation will complete much faster if it doesn't have to retrieve the image and pass it back.
  2. Depending on the number and size of the images, the bandwidth for handling of that data will shift to the client instead of having to be used by the server.
  3. The browser can cache the image data so it doesn't need to retrieve it every time, potentially.
  4. Lazy loading can be used in the client to potentially give a more performant experience.

If the images are large and fewer in number, however, this might be a different problem and you'd want to handle it on the server so you could perhaps cache the image data.

Browsers are very good at handling image data. You can check out a bit more about this if you're interested at TMS Software | Blog | Tabulator Performance or by looking at the current version of the project described there at https://www.actorious.com. Plenty of images loaded very quickly where just the URLs are passed back from XData.

2 Likes