Theo's Typesafe CultTTC
Theo's Typesafe Cult9mo ago
34 replies
moaaz

CORS error in react vite and express

When uploading an image it starts correctly then I get this cors error.
I've this cors settings in vite.config.ts
proxy: {
        '/api': {
            target: env.SERVER_URL,
            changeOrigin: true,
          },
cors: {
        origin: [/^https:\/\/[\w-]+\.ingest\.uploadthing\.com$/],
},

And this is the cors setup in express
const LOCAL_REGEX = /^https?:\/\/localhost(?::\d+)?$/
const localCors = cors({
    origin: (origin, cb) => {
        if (!origin || LOCAL_REGEX.test(origin)) cb(null, true)
        else cb(new Error('Not allowed by CORS: ' + origin))
    },
    credentials: true,
})
const UPLOADTHING_REGEX = /^https:\/\/([a-z0-9-]+\.)*uploadthing\.com$/
const uploadCors = cors({
    origin: (origin, cb) => {
        if (!origin || UPLOADTHING_REGEX.test(origin)) cb(null, true)
        else cb(new Error('Not allowed by CORS: ' + origin))
    },
    credentials: false,
})

app.use((req, res, next) => {
    const origin = req.headers.origin || ''
    if (LOCAL_REGEX.test(origin)) {
        return localCors(req, res, next)
    }
    if (UPLOADTHING_REGEX.test(origin)) {
        return uploadCors(req, res, next)
    }
})


Does anyone know where the problem is ?
image.png
Was this page helpful?