Regex to validate image url which may contains extension like jpeg, jpg, gif, png

Question

Regex to validate image url which may contains extension like jpeg, jpg, gif, png

I'm using

/\.(jpg|jpeg|png|gif|webp)(\?.*)*$/i

but it gives false for https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&fmt=jpeg&qlt=80&.v=1603399121000

I'm expecting a regex which can give true if this extensions like jpg, jpeg, png, gif, webp are present in url.

Answer 1

I don't know what you'd like to do exactly but this should return true :

 var text = "https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&fmt=jpeg&qlt=80&.v=1603399121000"; const regex = new RegExp(/(\W)(jpg|jpeg|png|gif|webp)(\W)/); console.log(regex.test(text));

Answer 2

You can use this regex to test for URL parameter fmt=<format> :

• first example: fmt=jpeg in middle
• second example: fmt=jpeg at end
• third example: fmt=bmp (unsupported format)

 const regex = /\bfmt=(jpg|jpeg|png|gif|webp)(?=(&|$))/; [ 'https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&fmt=jpeg&qlt=80&.v=1603399121000', 'https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&qlt=80&.v=1603399121000&fmt=jpeg', 'https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&fmt=bmp&qlt=80&.v=1603399121000', ].forEach(url => { console.log(url + ' => ' + regex.test(url)); });

Output:

https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&fmt=jpeg&qlt=80&.v=1603399121000 => true
https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&qlt=80&.v=1603399121000&fmt=jpeg => true
https://store.storeimages.cdn-apple.com/4668/as-images.apple.com/is/macbook-air-gallery3-20201110?wid=4000&hei=3072&fmt=bmp&qlt=80&.v=1603399121000 => false

Explanation of regex:

• \b -- word boundary
• fmt= -- literal fmt= parameter (this is to avoid false positives)
• (jpg|jpeg|png|gif|webp) -- logical 'or' of supported file extensions
• (?=(&|$)) -- positive lookahead for either & or end of string