XDN's image optimizer uses wrong `access-control-allow-origin` header for shared images

Issues
1

I have multiple sites referencing the same images through the XDN image optimizer and when these images are prefetched, sometimes they fail because the access-control-allow-origin is different than the site requesting. The pattern seems to be the first site that requests that image is what gets cached for the access-control-allow-origin response header.

For example, attempting to prefetch images on https://moovweb-docs-xdn-nuxt-example-staging.moovweb-edge.io/, here are a few sample responses:

Request URL: https://opt.moovweb.net/?quality=30&height=250&width=250&img=https%3A%2F%2Fmoovweb-docs-xdn-examples-api-default.moovweb-edge.io%2Fimages%2Fwatches%2F4.jpg
Referrer Policy: strict-origin-when-cross-origin
accept-ranges: bytes
access-control-allow-methods: GET,POST,HEAD
access-control-allow-origin: http://127.0.0.1:3000 <<< BAD

Request URL: https://opt.moovweb.net/?quality=30&height=250&width=250&img=https%3A%2F%2Fmoovweb-docs-xdn-examples-api-default.moovweb-edge.io%2Fimages%2Fwatches%2F1.png
Request Method: GET
Status Code: 200 
Remote Address: 151.101.201.79:443
Referrer Policy: strict-origin-when-cross-origin
accept-ranges: bytes
access-control-allow-methods: GET,POST,HEAD
access-control-allow-origin: https://moovweb-docs-xdn-nuxt-example-staging.moovweb-edge.io <<< GOOD

Request URL: https://opt.moovweb.net/?quality=30&height=250&width=250&img=https%3A%2F%2Fmoovweb-docs-xdn-examples-api-default.moovweb-edge.io%2Fimages%2Fshoes%2F9.jpg
Referrer Policy: strict-origin-when-cross-origin
accept-ranges: bytes
access-control-allow-methods: GET,POST,HEAD
access-control-allow-origin: https://moovweb-docs-xdn-sapper-example-staging.moovweb-edge.io <<< BAD

In order to avoid this, I am appending a unique param at the end of the URL so it is cached separately for each site, though not sure if this is the best approach.

export function getOptimizedImageUrl(path) {
  return `https://opt.moovweb.net?quality=30&height=250&width=250&img=${encodeURIComponent(
    origin + path
  )}&nuxt`
}
2

The image optimizer is caching the response headers as well as the image, which is why you are seeing this behavior. For now, your solution is solid and will fix your issue. Long term we are developing new XDN image optimizer and will include this use case in the design.