Implement CORS / preflight support in the dev server

[marcins]

🙋 feature request

Currently the Parcel dev server only responds to GET and HEAD requests, so does not respond to CORS preflight requests. It does not appear to be possible to add the CORS middleware via .proxyrc.js (or at least adding it via app.use() is not effective - it possibly runs too late).

There should be an option that allows the dev server to respond to CORS preflight requests.

🤔 Expected Behaviour

Parcel dev server should work serving assets on a different domain than the application loading the assets, with the Chrome flag chrome://flags/#private-network-access-respect-preflight-results enabled.

😯 Current Behaviour

Preflight requests are ignored by the local dev server.

🔦 Context

In our internal usage, where in development mode assets are served locally, but the application itself is running under a different domain, and with the Chrome flag chrome://flags/#private-network-access-respect-preflight-results enabled, the browser won't load assets from the dev server because the CORS preflight requests are blocked.

💁 Possible Solution

• add a new option for parcel serve to opt-in to CORS support
• implement a middleware if this option is enabled (likely using https://expressjs.com/en/resources/middleware/cors.html)
• ensure this middleware runs before the request blocking in

  parcel/packages/reporters/dev-server/src/Server.js

  Lines 310 to 317 in a1391ed

  	if (req.method !== 'GET' && req.method !== 'HEAD') {
  	// method not allowed
  	res.statusCode = 405;
  	res.setHeader('Allow', 'GET, HEAD');
  	res.setHeader('Content-Length', '0');
  	res.end();
  	return;
  	}

[mischnic]

Is there a reason why this has to be a flag for the dev server? Could it just always respond to the preflight requests?

[imbrian]

It does not appear to be possible to add the CORS middleware via .proxyrc.js (or at least adding it via app.use() is not effective - it possibly runs too late).

Do you have a repro for this? Tried with a fresh Parcel project, and adding the cors middleware to .proxyrc.js seems to be working without changes to the GET/HEAD check in Server.serve. Although, if this is becoming default Chrome behavior, does seem worth supporting out-of-the-box/with a flag.

[marcins]

Is there a reason why this has to be a flag for the dev server? Could it just always respond to the preflight requests?

It could - I would assume the default would be fairly relaxed about allowed domains etc, so not sure if folks would want it on by default.. I would assume the risk is low, but I'd prefer to err on the side of caution?

Do you have a repro for this? Tried with a fresh Parcel project, and adding the cors middleware to .proxyrc.js seems to be working without changes to the GET/HEAD check in Server.serve. Although, if this is becoming default Chrome behavior, does seem worth supporting out-of-the-box/with a flag.

I'll ping you internally - it's possible the affected user didn't do this correctly (I didn't check, I took their word for it!)