I am using csurf as recommended in my Express application to guard against cross sites forgeries. I have registered it globally(illustrated with code below) and so far so good.
Now, I have added multer.js to be able to upload images and as their documentation recommends it, it's more secure to attach multer to each express route where you intend to use.
Now when I do attach multer to my upload routes, I am faced with a 'ForbiddenError: invalid csrf token' and I really don't know why, as my view I am submitting the form from, as a csrf token attached to it.
Below is my code and I would really appreciated any help/suggestions. Thank you all
const express = require('express');
const csrf = require('csurf');
const csrfProtection = csrf();
const shopRoute = require('../Routes/shop');
const app = express();
app.use(csrfProtection);
app.use(shopRoutes);
const express = require('express')
const router = express.Router();
const multer = require('multer');
const controllers = require('../Controllers/shop');
router.post('/upload', multer({storage: multer.memoryStorage(), fileFilter: fileFilter), controller.uploadFunction);
I'm guessing the problem is that when you are uploading a file, the content type of the request becomes multipart/form-data, and you cannot simply pass the csrf token to Express in the body anymore.
The API allows to pass it in the URL though. Try passing the token in the _csrf parameter, that I think should solve your issue. So simply post the form to .../?_csrf={your_token}. Note though that this is slightly less secure than passing your csrf token in the request body, and might be flagged as a potential vulnerability in later penetration tests if you ever have one.
Alternatively, for a little more security, you can also pass it as a request header, but that might be a little trickier on the client side. According to the docs, Express will take the token from the following:
req.body._csrf - typically generated by the body-parser module.
req.query._csrf - a built-in from Express.js to read from the URL query string.
req.headers['csrf-token'] - the CSRF-Token HTTP request header.
req.headers['xsrf-token'] - the XSRF-Token HTTP request header.
req.headers['x-csrf-token'] - the X-CSRF-Token HTTP request header.
req.headers['x-xsrf-token'] - the X-XSRF-Token HTTP request header.
So adding a csrf-token header should also work.
Disclaimer: I don't know multer.js at all, and have very little experience with Express.