node.js - Express CSURF returnează ForbiddenError: token csrf invalid


Fundal

Am o aplicație Express care folosește TypeScript. Intenționez să creez un backend care să autentifice utilizatorii și să preia date etc.
De asemenea, am o aplicație React care va apela acest backend separat prin axios.

Am o strategie locală PassportJS pentru autentificare împreună cu Express-Session
Până acum toate bune. Până când am decis să adaug protecție CSRF cu biblioteca csurf care este sugerată în documentația Express aici

Am urmat instrucțiunile exact așa cum sunt furnizate în documentație. Pornirea aplicației nu mi-a creat niciun fel de problemă. Fără a utiliza csurf, pot face cereri POST din aplicația mea React fără nicio problemă. Cu toate acestea, după ce am inițializat csurf, când am făcut o cerere post, am primit o eroare 403 Forbidden a cărei mesaj de eroare începe cu:

ForbiddenError: token csrf invalid urmat de câteva căi aleatorii

Ce am încercat

Cred că nu sunt singurul care se confruntă cu această problemă, în care există destul de mulți alți oameni care au întrebat același lucru. Am văzut sugestiile lor, dar ele nu par să funcționeze și nici nu abordează problema mea de a nu putea efectua apeluri dintr-o aplicație React. Este de la sine înțeles că am testat și efectuarea de cereri POST prin Postman și nici asta nu a funcționat.

Cod

Următorul este codul meu

import express, { request, Request, Response } from 'express'
import 'dotenv/config'
import passport from 'passport';
import session from 'express-session';
import clientController from './client/client';
import authController from './auth/auth.controller';
import saController from './superadmin/superadmin';
import cors from 'cors';
import csurf from 'csurf';
import cookieParser from 'cookie-parser';
import bodyParser from 'body-parser';

const app = express();
app.use(cookieParser())
app.use(bodyParser.urlencoded({ extended: true }))
app.use(express.json())
app.use(cors({
    credentials: true,
    origin: ['http://localhost:3000']
}));

const csrfMiddleware = csurf({ cookie: true })

const port = process.env.PORT
const sessionSecret = process.env.SESSION_SECRET

app.use(session({
    secret: sessionSecret!.toString(),
    resave: true,
    saveUninitialized: false,
    cookie: {
        httpOnly: true
    }
}))
app.use(csrfMiddleware)

app.use(passport.initialize());
app.use(passport.session());

passport.serializeUser((user: Object, done) => {
    console.log(user)
    done(null, user)
})

passport.deserializeUser((user: Object, done) => {
    done(null, user);
})

//Authentication route
const authRoute = authController
app.use('/auth', authRoute);

Ce sper să obțin din asta

M-am ocupat de asta de o zi sau cam așa și sper că cineva are un răspuns la această problemă. Dacă nu, aș spera că cineva poate sugera o altă bibliotecă pe care aș putea să o folosesc.