Reactjs – React App with Vite fetch request to Express Backend is refused by CSP and CORS

My Front-End is set up with Vite-Express and React. When registering a User, react is sending a post request to "http://127.0.0.1/3001/auth/register".

The Console spits out:

   POST http://127.0.0.1/3001/auth/register net::ERR_CONNECTION_REFUSED

I have set my cors like this:

/** CORS CONFIG VIA HELMET */
app.use(
  helmet({
    crossOriginResourcePolicy: false,
  })
);

my csp setup: (I had problems with this aswell)

app.use(
  helmet.contentSecurityPolicy({
    directives: {
      defaultSrc: ["'self'"],
      scriptSrc: ["'unsafe-inline'", "localhost:*"],
      objectSrc: ["'none'"],
      connectSrc: ["'self'", "localhost:*", "http://127.0.0.1:*"],
      upgradeInsecureRequests: [],
    },
  })
);

The request i am trying to make:

const register = async (values, onSubmitProps) => {
        const savedUserResponse = await fetch(
            "http://127.0.0.1/3001/auth/register",
            {
                method: "POST",
                headers: { "Content-Type": "application/json" },
                body: {
                    user: {
                        username: values.username,
                        password: values.password,
                        wallets: [{
                            name: values.wallet,
                            balance: values.balance
                        }]

                    }
                }
            }
        )
        const savedUser = await savedUserResponse.json();
        onSubmitProps.resetForm()

        if (savedUser) {
            setPageType("login")
        }
    };

The Backend Route:

******controllers/auth.js******
export const register = async (req, res) => {
    try {
        const {
            username,
            password,
            wallets,
            balance
        } = req.body.user;
        const salt = await bcrypt.genSalt();
        const passwordHash = await bcrypt.hash(password, salt);

        req.body.user.password = passwordHash
        req.body.user.wallets = [{ name: wallets, balance: balance }]
        console.log(req.body.user)

        const newUser = new User(
            req.body.user
        );
        const savedUser = await newUser.save();
        console.log(savedUser, "savedUser")
        res.status(201).json(savedUser);
    } catch (err) {
        res.status(500).json({ error: err.message });
    }
}
******routes/auth.js****** 
import express from "express";
import { login, register } from "../controllers/auth.js"

const router = express.Router();

router.post("/register", register)
export default router;

I tried turning off CORS which didn’t help.

Any requests i make from Postman are working, indicating the Problem is with the Front end and/or Security Protocols.

You can find the whole Codebase here:
https://github.com/bigpaloma/expenseTracker

The Package I used to initiate my Vite App with React and Express:
https://github.com/szymmis/vite-express?tab=readme-ov-file#-installation–usage