Regexp, remove part in the middle of a url - javascript

Question

I'm a beginner at regexp in javascript and getting a bit confused: here's the url:

https://www.example.com.au/media/catalog/product/cache/ca6a1abe4cdf1032b0397780507d1aa8/h/u/hugh_camel_1_web.jpg

I would like to remove the id of the product ca6a1abe4cdf1032b0397780507d1aa8/ but am getting a bit dizzy looking and testing all the examples I could find (with no success).

Expected output:

https://www.example.com.au/media/catalog/product/cache/h/u/hugh_camel_1_web.jpg

Thanks in advance for the help.

Any detailed explanation of the regex would also be awesome.

Answer 1

You can use this regex:

 const url = "https://www.example.com.au/media/catalog/product/cache/ca6a1abe4cdf1032b0397780507d1aa8/h/u/hugh_camel_1_web.jpg"; const regex = /(\product\/cache\/)[^\/]*\//; let result = url.replace(regex, '$1'); console.log(result);

Output:

https://www.example.com.au/media/catalog/product/cache/h/u/hugh_camel_1_web.jpg

Explanation of regex:

• (\product\/cache\/) - capture group for /product/cache/
  • Note: You could use a positive lookbehind, but that is not yet universally supported by all browsers
• [^\/]* - scan over everything until just before next /
• \/ - scan over /
• in the replace use just the capture group, and ignore the scanned pattern after that: '$1'

EDIT: Here is the positive lookbehind version that does not capture a group, eg the replacement can be an empty string '' .

 const url = "https://www.example.com.au/media/catalog/product/cache/ca6a1abe4cdf1032b0397780507d1aa8/h/u/hugh_camel_1_web.jpg"; const regex = /(?<=\product\/cache\/)[^\/]*\//; let result = url.replace(regex, ''); console.log(result);