Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Do you need app.options and app.use(cors()); ?? #277

Open
sinclas opened this issue Sep 4, 2022 · 12 comments
Open

Do you need app.options and app.use(cors()); ?? #277

sinclas opened this issue Sep 4, 2022 · 12 comments
Labels

Comments

@sinclas
Copy link

sinclas commented Sep 4, 2022

Hi,

I have a client that is getting a CORS error for preflight. So, we added the"app.options", in addition to the app.use. Do we need to add both for all routes? (nodeJS with Express).

Code in the main JS file in node. This is executed prior to any routes:

app.options('*', cors()) // include before other routes
app.use(cors()); // Header support for Express

Is this redundant? Will the second line cause the preflight to fail or are both necessary? We have a client that is failing the preflight with both Chrome and Edge.

Thanks!
Steve

@dougwilson
Copy link
Contributor

Hello, and sorry you are having trouble. To answer your question, if you are using app.use for your cors middleware then you do not need to also use app.options, though it won't hurt anything. The reason is that app.use will run for all http methods -- only if you have the cors middleware on a non-options route like app.post that needs to support preflight requests would also need the app.options configuration.

@sinclas
Copy link
Author

sinclas commented Sep 4, 2022

Hi,
I had a feeling that was the case. We only used app.use(cors());, but then out of nowhere, a client of ours is having preflight failure and can't use our platform. We added the app.options('*', cors()) as a precaution to the preflight issues but they are still having preflight issues in both Chrome and Edge. We are trying to make sure everything on the server side is solid. We have never seen this before and then there is a preflight failure....out of nowhere. There is nothing more we can do on our side, other than suggest a plugin for the client., which is not the best option.

What other options should we pursue if the client is still failing? This is the Chrome error (real web address changed) : 'https://sampleapi.com/me' from origin 'https://sampleeapp.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin'

Any help on this would be appreciated!

thanks.
Steve

@fzn0x
Copy link

fzn0x commented Sep 6, 2022

Same issue with me, are you using an API gateway?

@fzn0x
Copy link

fzn0x commented Sep 6, 2022

If yes, you can check if there's any solution provided by the infrastructure documentation for CORS.

@sinclas
Copy link
Author

sinclas commented Sep 7, 2022

No, I have a NodeJS instance running solo. I do use the AWS gateway API and no CORS issues there. Will send the account that is having issues a link to one of those CORS test websites. I have done everything on the server side at this point!

@jub0bs
Copy link

jub0bs commented Oct 31, 2022

@sinclas It would be interesting to see the problematic preflight request and its response.

@andrewdibiasio6
Copy link

@sinclas I am having similar issues. Any updates? I actually can see that my server is not providing the "allow-control-access-origin" header. This only happened when I enabled credentials. I also have this issue with edge, firefox, and chrome"

@digtiarenko
Copy link

Same here

@alexnault
Copy link

#277 (comment)

@sinclas We are having this exact issue. Did you manage to get around it?

@LanguageXange
Copy link

any update on this ? thanks!

@parasop
Copy link

parasop commented Apr 25, 2023

access to fetch at 'https://localhost:3000' from origin 'localhost:5000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

@lazarok09
Copy link

lazarok09 commented Dec 31, 2023

Hi guys, i managed to get a solution to this issue by adding a lib called cors. This is my express controller of auth methods.

The provided code demonstrates how the origin key in the corsOptions object is utilized to specify the correct origin, which is set to localhost:3000 in this instance. However, it's important to note that in your specific scenario, this origin value is likely to differ. You should tailor it to match the website for which you are encountering CORS preflight issues.

import express, { Response } from 'express';

import AuthController from '../../controllers/auth';
import cors from 'cors';

const corsOptions = {
  origin: "http://localhost:3000",
  optionsSuccessStatus: 200, // some legacy browsers (IE11, various SmartTVs) choke on 204
};

export const AuthRouter = () => {
  const router = express.Router();
  // Auth
  router.use('/', express.json());
  router.use('/', express.urlencoded({ extended: true }));

  router.use('/signin', cors(corsOptions));
  router.post('/signin', AuthController.signIn);
  return router;
};

What you guys need to test before going to browser, is if the OPTIONS method return all the things you guys need. In my case, was just the allow origin that was missing. As we can see here in the Insomnia

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests