I’m trying to deploy my MERN app via vercel. I switched all the axios calls to the .env variable but now when i try to visit a page on the website that talks to the backend, i get this error:

Access to XMLHttpRequest at 'https://backend.vercel.app/webpage' from origin 'https://frontend.vercel.app' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

Here is my CORS middleware:

const cors = require("cors");
const session = require("express-session");
const MongoStore = require('connect-mongo');
const port = process.env.PORT || 8082;
const app = express();

app.use(cors({
  origin: 'https://gcm-frontend.vercel.app', // allow requests from frontend
  methods: ['GET', 'POST', 'PUT', 'DELETE'], // Allowed  methods
  allowedHeaders: ['Content-Type', 'Authorization','User-Agent', 'Accept', 'Referer'], // headers to allow
  credentials: true, // allow setting of cookies or sessions
}));

app.options('*', cors());