How to use resized images from the API as meta tags

When I share a hyperlink to my webpage, I want to show an image stored in Contentful.
My application (Angular) add a <meta property="og:image"> tag, and adds the url to the API. This works.

However, sharing a hyperlink through certain Social Media sets a limit on the size of the image. (often the image has to be smaller than 4MB) So I wanted to add query parameters to shrink the image, like this:

https://images.ctfassets.net/496uch1l97fc/1akWnopnAtXpX2OhOpHML8/1662f1aebf4a7dabeb5a151188498c26/Studeren__fotocredit__Keira_Burton_.jpg?fm=webp&w=1200&h=630

However, HTML automatically encodes it like this <meta property="og:image" content="https://images.ctfassets.net/496uch1l97fc/1akWnopnAtXpX2OhOpHML8/1662f1aebf4a7dabeb5a151188498c26/Studeren__fotocredit__Keira_Burton_.jpg?fm=webp&amp;w=1200&amp;h=630">

Every & is converted to &amp; and the link doesn’t work anymore.

Has anyone every had this problem? Is there a way to retrieve smaller images from the API without adding ampersands?