Placeholder redirects and CORS don't mix

[steverep]

The problem

We want to have the service worker cache brand images for performance and offline use (home-assistant/frontend#17840). In order to do this, all responses must contain the Access-Control-Allow-Origin header. These were added in #4652, but they do not apply to the 302 redirects to the placeholder images. So when the frontend goes to fetch them, a CORS error is thrown.

AFAIK, there is no way to actually modify the headers of a redirect for security reasons (e.g. Response.redirect() creates a response with immutable headers). There is also a relevant discussion in the Netlify support forum.

A potentially easy fix is to just rewrite the URL instead of redirecting it, which can be done in netlify.toml. However, Netlify applies the [[headers]] for the request URL, not the rewritten one, so it won't be cached as desired.

Similarly, [[headers]] in the config file are applied regardless of the response status, which means requests without a placeholder fallback that return a 404 are currently being cached for the longer time.

The only way I see to achieve the desired responses is to use an edge function.

Proposed Solution

1. Use an edge function to handle all the image responses. It sets the cache and CORS headers as desired.
2. Use a query parameter to request a placeholder fallback instead of the /_/ directory. This cuts the domain storage in half, and makes it much simpler and safer to test for in the edge function. It would also make it easier for the frontend service worker to manipulate how images are cached if needed.