Cloudinary supports file type restriction on the server-side for uploaded assets, and this can be specified either in the API call you make, or in an upload preset. This is accomplished via the 'allowed_formats' parameter: https://cloudinary.com/documentation/image_upload_api_reference#optional_parameters
This example using our Python SDK will allow only PNG uploads:
uploader.upload("test-image.png", allowed_formats = ['png'])
This next example will return an error when the file is uploaded because it doesn't match the 'jpg' format allowed:
uploader.upload("test-image.png", allowed_formats = ['jpg'])
You can instruct Cloudinary to convert rejected formats to another one, by setting the format parameter. In this example, we allow only 'jpg' files, and if the uploaded file is not a JPG, Cloudinary will first convert it to JPG before uploading:
uploader.upload("tests/logo.png", allowed_formats = ['jpg'], format= 'jpg')
As for upload presets, create or edit an upload preset, then navigate to the "Upload Control" section as seen below:
You can also use our Upload Widget to validate or adjust format, size, and dimensions on the client-side.
For more information about pre-batch validation, please refer to the Upload Widget documentation reference.
Comments
8 comments
So if I understand this correctly, this line will result in the file which is stored on Cloudinary being converted into a JPEG from a PNG. No PNG file will exist in Cloudinary, only a JPEG file.
uploader.upload("tests/logo.png", allowed_formats = ['jpg'], format= 'jpg')
When building the URL to display that file, if I use the generated public ID, then there is no file extension given by default.
Image files load fine when I don't give an extension but I feel a bit twitchy not providing an extension to the browser.
Is it always fine to leave the extension off or will some browsers choke (does IE cope for example?) and therefore is it best to always add an extension on the end of the type you want to download and render? (I know it's possible to upload a JPEG and then download using a .gif extension to have conversions done on download).
When omitting the extension part, Cloudinary delivers the image as the original image's format. When the extension part of URL is added (e.g.,
.jpg
), Cloudinary explicitly delivers the image as the given format (e.g., Cloudinary converts all other image formats to JPG on delivery).Certain very old viewers (e.g., browsers) might require the correct extension, but currently you don't really need the file extension (but it's a nice convention to have this).
Thank you Itay - excellent answer as usual! :)
So if I use the above "format" argument, set to jpeg, but actually upload a gif, and then I do not specify a file extension, clients will actually download a gif because there was a never a JPEG file saved.
I think I'll specify an extension since if anyone saves the image, both Windows and OSX use the extension to determine the file type.
Hi David,
Please note that it if you set the
format
parameter while uploading (as an incoming transformation), e.g.,:Cloudinary takes the original GIF image, converts it to JPG and only then stores the image (the JPG one) in your account, the GIF won't be stored at all.
Therefore, delivering this stored Cloudinary image with no extension will actually result a JPG.
I hope that makes sense.
Yes that makes perfect sense - my example was muddled and wasn't what I meant to be saying at all! Thanks again Itay!
I have a question about SVG format. I want to use it as a background in css, but unfortunately if Cloudinary delivers it without extension the image is not working. Please check an example: https://codepen.io/seleckis/pen/PoZNezd
You can try to access the url of image provided and the browser will download an svg file without extension, but as a background it doesn't work without extension.
Could you please suggest any alternative solution?
Hi webskola,
In your codepen, the image URL you used returns a 404 error - can you check if that's the correct URL? To give a general answer, if you upload a file as 'raw' you should include the file extension in the public_id you use.
It's also possible to use SVG images directly as 'image' files which can be transformed or returned in their original SVG format. By default, if you directly access a .svg image URL, we'll send headers with the image asking the browser to open the image as an attachment instead of inline (though it will work OK in image tags or CSS), but you can add the fl_sanitize transformation to the URL and we'll return it inline also after scanning the file
Thanks,
Stephen
Hi. No, it does not return 404. Please check response: https://imgur.com/4dS1e28
> To give a general answer, if you upload a file as 'raw' you should include the file extension in the public_id you use.
I'm using Strapi with this plugin to upload files to cloudinary: https://github.com/strapi/strapi/blob/master/packages/strapi-provider-upload-cloudinary/lib/index.js
Do you mean, that on line 19 public_id needs file extension?
Please sign in to leave a comment.