Skip to main content
Solved

Allow "head" requests for /image to get file size before downloading the image

  • November 24, 2023
  • 8 replies
  • 1366 views

Knowing the file size before fetching the content can drastically improve the user experience and save bandwidth.

Image urls returned from the /api/image endpoint don’t allow HEAD requests.

As described on MDN, the HTTP HEAD Method can be used to do that. It will return the content-length:

MDN Web Docs

Unfortunately the images served from S3 only allow GET requests.

Feature request
Allow HEAD requests on the S3 image URLs

Reproduction:

Best answer by jefflee

Thanks for clarifying. I think either of your suggestions (allowing S3 HEAD requests and supplementing the /v1/images response) might be possible. We’ll log your request, it’s a good one!

View original
This topic has been closed for replies.

8 replies

  • Author
  • 5 replies
  • November 24, 2023

Another solution would be to provide the file size with the /api/image response, but this would change the output format and might not be desirable 🙂


Florian_Schulz

Bumping this topic. 🙂


jefflee
Figmate
  • Figmate
  • 24 replies
  • November 30, 2023

To clarify, are you referring to the REST API image endpoint, or something else?


  • Author
  • 5 replies
  • November 30, 2023

I’m referring to the actual image urls returned by the /image endpoint.

I want to know the file size of the image behind the url, before downloading it.

Instead of making a GET request which would download the actual image, I want to make a HEAD request to get the content-length.

This works if I make the request through PHP or Node, but my app is running in the browser and Figma’s image urls won’t allow these kind of HEAD requests from a browser.


jefflee
Figmate
  • Figmate
  • 24 replies
  • November 30, 2023

Can I confirm that this is the problem you’re encountering?

  • You’re using the GET /v1/images REST API call
  • You’re attempting to make a HEAD request from a browser request against one of the S3-hosted image URLs that are returned from the REST API call, and are running into a cross-origin error

Yes, exactly.

Here’s the console.log() for the same code that is making HEAD requests for:

  1. Image URL from Figma → CORS
  2. Image URL from Unsplash ✅

I wonder wether “HEAD” is not included in the “AllowedMethods” field of the CORS configuration of the S3 bucket? 🤷


jefflee
Figmate
  • Figmate
  • 24 replies
  • Answer
  • December 1, 2023

Thanks for clarifying. I think either of your suggestions (allowing S3 HEAD requests and supplementing the /v1/images response) might be possible. We’ll log your request, it’s a good one!


Great, thanks for listening!


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings