feat(security): implement robust CSRF protection and multi-origin CORS

Author: yash-pouranik

apps/dashboard-api/src/app.js

@@ -19,16 +19,8 @@ app.set('trust proxy', 1);
 const {garbageCollect, storageGarbageCollect, getPublicIp} = require('@urbackend/common');
 const { capture } = require('@kiroo/sdk');
 
-
-// Initialize Queue Workers
 const { emailQueue, authEmailQueue } = require('@urbackend/common');
 
-
-app.use(express.json());
-app.use(express.urlencoded({ extended: true }));
-app.use(cookieParser());
-app.use(csurf({ cookie: true }));
-
 const dashboardLimiter = rateLimit({
     windowMs: 15 * 60 * 1000,
     max: 1000,
@@ -37,23 +29,46 @@ const dashboardLimiter = rateLimit({
 });
 
 const whitelist = (function() {
-    const whitelist = [process.env.FRONTEND_URL];
+    // Default allowed origins
+    const allowed = [process.env.FRONTEND_URL];
+    
+    // Support comma-separated list of origins in .env
+    if (process.env.ALLOWED_ORIGINS) {
+        const extraOrigins = process.env.ALLOWED_ORIGINS.split(',').map(o => o.trim());
+        allowed.push(...extraOrigins);
+    }
+
     if (process.env.NODE_ENV === 'development') {
-        whitelist.push('http://localhost:5173');
+        allowed.push('http://localhost:5173');
+        allowed.push('http://localhost:3000');
     }
+
+    // Filter out duplicates and empty values
+    const uniqueAllowed = [...new Set(allowed.filter(Boolean))];
+
     return {
-        get: () => {
-            return whitelist.slice();
-        }
+        get: () => uniqueAllowed
     };
 })()
 
-
 app.use(cors({
     origin: whitelist.get(),
     credentials: true,
 }));
 
+app.use(express.json());
+app.use(express.urlencoded({ extended: true }));
+
+app.use(cookieParser());
+
+app.use(csurf({ 
+    cookie: {
+        httpOnly: true,
+        secure: process.env.NODE_ENV === 'production',
+        sameSite: process.env.NODE_ENV === 'production' ? 'none' : 'lax'
+    } 
+}));
+
 
 if (process.env.NODE_ENV !== 'test') {
     garbageCollect();
@@ -69,14 +84,12 @@ app.use(capture({
 
 
 
-// Route Imports
 const authRoute = require('./routes/auth');
 const projectRoute = require('./routes/projects');
 const releaseRoute = require('./routes/releases');
 
-// ROUTES SETUP 
 app.use('/api/auth', authRoute); 
-app.use('/api/projects', dashboardLimiter, projectRoute); // Project Mngmt
+app.use('/api/projects', dashboardLimiter, projectRoute);
 app.use('/api/releases', releaseRoute);
 
 
@@ -87,13 +100,20 @@ app.get('/api/server-ip', async (req, res) => {
     res.json({ ip });
 });
 
-// Test Route
 app.get('/', (req, res) => {
     res.status(200).json({ status: "success", message: "urBackend API is running 🚀" })
 });
 
 // Global Error Handler
 app.use((err, req, res, next) => {
+    // CSRF Error Handling
+    if (err.code === 'EBADCSRFTOKEN') {
+        return res.status(403).json({
+            error: "Invalid CSRF token",
+            message: "The form has expired or the CSRF token is invalid. Please refresh the page and try again."
+        });
+    }
+
     if (err instanceof SyntaxError && err.status === 400 && 'body' in err) {
         return res.status(400).json({
             error: "Invalid JSON format",
@@ -112,7 +132,6 @@ app.use((req, res) => {
     const id = res.get("X-Kiroo-Replay-ID");
     res.json({error: "Not Found", replayId: id})   
 })
-// INITIALIZATION
 if (process.env.NODE_ENV !== 'test') {
 
     const PORT = process.env.PORT || 1234;

apps/dashboard-api/src/controllers/auth.controller.js

@@ -32,15 +32,14 @@ const sendTokenResponse = async (user, statusCode, res) => {
         { expiresIn: REFRESH_TOKEN_EXPIRES_IN }
     );
 
-    // Save refresh token to DB (Rotation)
     user.refreshToken = refreshToken;
     await user.save();
 
     const cookieOptions = {
         httpOnly: true,
         expires: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000), // 7 days
         secure: process.env.NODE_ENV === 'production',
-        sameSite: 'Strict' // Use Strict for better CSRF protection
+        sameSite: 'Strict'
     };
 
     if (process.env.NODE_ENV === 'production') {
@@ -67,18 +66,15 @@ const sendTokenResponse = async (user, statusCode, res) => {
 async function createAndStoreOtp(userId) {
     const otp = crypto.randomInt(100000, 1000000).toString();
 
-    // Delete any existing OTP for this user
     await otpSchema.deleteOne({ userId });
 
-    // Hash OTP before storing
     const salt = await bcrypt.genSalt(10);
     const hashedOtp = await bcrypt.hash(otp, salt);
 
     await new otpSchema({ userId, otp: hashedOtp }).save();
     return otp;
 }
 
-// HELPER: Validate OTP with attempt tracking
 async function validateOtp(userId, passedOtp) {
     const otpDoc = await otpSchema.findOne({ userId });
     if (!otpDoc) throw { status: 400, message: "No OTP found. Please request a new one." };
@@ -101,7 +97,6 @@ async function validateOtp(userId, passedOtp) {
 
 module.exports.register = async (req, res) => {
     try {
-        // POST FOR - REGISTER
         const { email, password } = loginSchema.parse(req.body);
 
         const existingUser = await Developer.findOne({ email });
@@ -148,7 +143,6 @@ module.exports.login = async (req, res) => {
 
 module.exports.changePassword = async (req, res) => {
     try {
-        // POST FOR - CHANGE PASSWORD
         const { currentPassword, newPassword } = changePasswordSchema.parse(req.body);
 
         const dev = await Developer.findById(req.user._id);
@@ -173,7 +167,6 @@ module.exports.changePassword = async (req, res) => {
 
 module.exports.deleteAccount = async (req, res) => {
     try {
-        // POST FOR - DELETE ACCOUNT
         const { password } = deleteAccountSchema.parse(req.body);
 
         const dev = await Developer.findById(req.user._id);
@@ -216,7 +209,6 @@ module.exports.sendOtp = async (req, res) => {
 
 module.exports.verifyOtp = async (req, res) => {
     try {
-        // POST FOR - VERIFY OTP
         const { email, otp } = verifyOtpSchema.parse(req.body);
 
         const existingUser = await Developer.findOne({ email });
@@ -244,7 +236,6 @@ module.exports.forgotPassword = async (req, res) => {
         const { email } = onlyEmailSchema.parse(req.body);
 
         const dev = await Developer.findOne({ email });
-        // Return same message regardless of whether email exists (prevents user enumeration)
         if (!dev) return res.status(200).json({ message: "If this email is registered, an OTP has been sent." });
 
         const otp = await createAndStoreOtp(dev._id);
@@ -262,15 +253,13 @@ module.exports.forgotPassword = async (req, res) => {
 // RESET PASSWORD
 module.exports.resetPassword = async (req, res) => {
     try {
-        // POST FOR - RESET PASSWORD
         const { email, otp, newPassword } = resetPasswordSchema.parse(req.body);
 
         const dev = await Developer.findOne({ email });
         if (!dev) return res.status(400).json({ error: "User not found" });
 
         const otpDoc = await validateOtp(dev._id, otp);
 
-        // UPDATE PASSWORD
         await otpDoc.deleteOne();
         const salt = await bcrypt.genSalt(10);
         dev.password = await bcrypt.hash(newPassword, salt);

apps/dashboard-api/src/routes/auth.js

@@ -26,34 +26,29 @@ const dashboardLimiter = rateLimit({
 });
 
 
-// REGISTER ROUTE
 router.post('/register', authLimiter, register);
 
-// LOGIN ROUTE
 router.post('/login', authLimiter, login);
 
-// Apply more relaxed dashboard limiter to the rest
 router.use(dashboardLimiter);
 
-// CHANGE PASSWORD (Protected)
 router.put('/change-password', authorization, changePassword);
 
-// DELETE ACCOUNT (Protected - Danger Zone)
 router.delete('/delete-account', authorization, deleteAccount);
 
-// OTP (email verification)
 router.post('/send-otp', sendOtp);
 router.post('/verify-otp', verifyOtp);
 
-// PASSWORD RESET (FIX 5)
 router.post('/forgot-password', forgotPassword);
 router.post('/reset-password', resetPassword);
 
-// REFRESH & LOGOUT
 router.post('/refresh-token', refreshToken);
 router.post('/logout', authorization, logout);
 
-// GET ME
 router.get('/me', authorization, getMe);
 
+router.get('/csrf-token', (req, res) => {
+    res.json({ csrfToken: req.csrfToken() });
+});
+
 module.exports = router;

…-dashboard/dist/assets/index-O6PjDT8g.js …-dashboard/dist/assets/index-C_cBA58F.jsapps/web-dashboard/dist/assets/index-O6PjDT8g.js renamed to apps/web-dashboard/dist/assets/index-C_cBA58F.js apps/web-dashboard/dist/assets/index-O6PjDT8g.js renamed to apps/web-dashboard/dist/assets/index-C_cBA58F.js

@@ -12,7 +12,7 @@
       href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;600&display=swap"
       rel="stylesheet"
     />
-    <script type="module" crossorigin src="/assets/index-O6PjDT8g.js"></script>
+    <script type="module" crossorigin src="/assets/index-C_cBA58F.js"></script>
     <link rel="stylesheet" crossorigin href="/assets/index-DAhCOP-a.css">
   </head>
   <body>

apps/web-dashboard/dist/index.html

@@ -3,34 +3,54 @@ import { API_URL } from '../config';
 
 const api = axios.create({
     baseURL: API_URL,
-    withCredentials: true, // Crucial for sending/receiving cookies
+    withCredentials: true,
 });
 
-// Response interceptor to handle 401s and refresh token
+let csrfToken = null;
+
+const fetchCsrfToken = async () => {
+    try {
+        const response = await axios.get(`${API_URL}/api/auth/csrf-token`, { withCredentials: true });
+        csrfToken = response.data.csrfToken;
+        return csrfToken;
+    } catch (err) {
+        console.error("Failed to fetch CSRF token:", err);
+        return null;
+    }
+};
+
+api.interceptors.request.use(async (config) => {
+    const method = config.method.toLowerCase();
+    
+    if (['post', 'put', 'delete', 'patch'].includes(method)) {
+        if (!csrfToken) {
+            csrfToken = await fetchCsrfToken();
+        }
+        if (csrfToken) {
+            config.headers['X-CSRF-Token'] = csrfToken;
+        }
+    }
+    return config;
+}, (error) => Promise.reject(error));
+
 api.interceptors.response.use(
     (response) => response,
     async (error) => {
         const originalRequest = error.config;
 
-        // If error is 401 and we haven't retried yet
         if (error.response?.status === 401 && !originalRequest._retry) {
 
-            // Avoid infinite loops if refresh-token itself fails with 401
             if (originalRequest.url.includes('/api/auth/refresh-token')) {
                 return Promise.reject(error);
             }
 
             originalRequest._retry = true;
 
             try {
-                // Attempt to refresh tokens
                 await axios.post(`${API_URL}/api/auth/refresh-token`, {}, { withCredentials: true });
 
-                // If refresh succeeds, retry the original request
                 return api(originalRequest);
             } catch (refreshError) {
-                // If refresh fails, we can't do much - user needs to log in again
-                // We'll let the component/AuthContext handle the final failure
                 return Promise.reject(refreshError);
             }
         }