Is there a way to get file URLs in initial query of items?

[holmesadrianh]

I am not sure if I am missing something, but I am noticing that my web application requires quite a few server requests when it comes to retrieving image URLs. If I request a number of items, each with an image, I then have to send a request to the server for each image ID just to get the image URL. Is there a way to have the image URL included directly in the first request?

For example, I first request items:

URL: {{Directus URL}}/items/media

Return data:

{
    "data": [
        {
            "id": 1,
            "status": "published",
            "modified_by": 1,
            "modified_on": "2020-06-11 17:09:41",
            "article_title": "Article Title here",
            "article_description": "Lorem ipsum, dolor sit amet consectetur adipisicing elit. Adipisci, fugit magnam laboriosam autem earum ratione accusamus consequuntur dolore accusantium.",
            "article_date": "2016-05-18",
            "article_thumbnail": 43
        }
    ],
    "public": true
}

Then I have to request the image data to get the image URL:
URL: {{Directus URL}}/files/43

Return data:

{
    "data": {
        "id": 43,
        "storage": "local",
        "filename": "unsplash-00016.jpg",
        "title": "Unsplash 00016",
        "type": "image\/jpeg",
        "uploaded_by": 1,
        "uploaded_on": "2020-06-11T16:54:35+00:00",
        "charset": "binary",
        "filesize": 342811,
        "width": 1920,
        "height": 1920,
        "duration": null,
        "embed": null,
        "folder": null,
        "description": "",
        "location": "",
        "tags": [],
        "checksum": "6a3f45c42819226347cf32f10af4887e",
        "metadata": null,
        "data": {
            "full_url": "{{SERVER URL}}/content\/public\/uploads\/_\/originals\/unsplash-00016.jpg",
            "url": "\/uploads\/_\/originals\/unsplash-00016.jpg",
            "thumbnails": [
                {
                    "url": "{{SERVER URL}}/content\/public\/thumbnail\/_\/200\/200\/crop\/good\/unsplash-00016.jpg",
                    "relative_url": "\/thumbnail\/_\/200\/200\/crop\/good\/unsplash-00016.jpg",
                    "dimension": "200x200",
                    "width": 200,
                    "height": 200
                }
            ],
            "embed": null
        }
    },
    "public": true
}

No the issue comes in is when I have 100 items in the initial request. I have to them request an image for every item. There is a clear delay in the loading of the page.

Is there a was to access the image URL from the initial query? Is there a way to include the image data instead of just the ID? Or at the very least the URL to the image itself?

[benhaynes]

The fields parameter...

https://docs.directus.io/getting-started/troubleshooting.html#why-is-my-relational-data-file-only-returning-an-id

[holmesadrianh]

That did the trick! Thank you!