Add/modify Headers (CORS)

[jcubic]

Is your feature request related to a problem? Please describe.

I'm working on a blog that uses Giscus that allows to change theme by using custom CSS. In order to use this feature you need to put a full path to the CSS file when initializing the Giscus. So when using the path to the dev server I got a CORS error.

Describe the solution you'd like

CORS option for dev server

Describe alternatives you've considered

I was thinking of using a Chrome extension that enables CORS headers (like CORS everywhere) but the last time I checked an extension like this it was not working when CORS was needed.

Additional context

No response

[craig552uk]

Not a fix, but you can hack in CORS support to the dev server by adding this to line 418 of node_modules/@11ty/eleventy-dev-server/server.js

res.setHeader("Access-Control-Allow-Origin", '*');

[jcubic]

@craig552uk it looks exactly like a fix. If maintainers of Eleventy decide it fits into the project.

[uncenter]

@craig552uk the repository for that code is at https://github.com/11ty/eleventy-dev-server, you could raise a PR for that fix.

[zachleat]

Seems like a mechanism to add/modify headers would be useful! I don’t know that I’d want to Access-Control-Allow-Origin everything by default, but some kinda hook would be good!

[zachleat]

Here’s an example of that happening in the code now (though this example is not user configurable) https://github.com/11ty/eleventy-dev-server/blob/55099ca1573d6f35b97c7e26bc17b2efbcccb9b5/server.js#L494

[jcubic]

It should be simple to add headers to default options.

[craig552uk]

PR for my initial suggestion https://github.com/11ty/eleventy-dev-server/pull/81

I consider this to be a hack rather than a fix, as it's probably not desirable to add this to all responses. I'd favour a hook (as @zachleat suggested) though don't have the time to work on it.