has been blocked by CORS policy: Request header field contend-type is not allowed by Access-Control-Allow-Headers

Question

I learn NodeJS and REACT and I built the frontend and the backend. for now, I want to connect the front to the back.

so, I add those lines of code in my app.js of the backend:

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept, Authorization"
  );
  res.setHeader("Access-Control-Allow-Methods", "GET, POST, PATCH, DELETE");

  next();
});

and my full app.js (pay attention that I delete the URL of the MongoDB because i don't want to publish it:

const express = require("express");
const bodyParser = require("body-parser");
const mongoose = require("mongoose");

const placesRoutes = require("./routes/places-routes");
const usersRoutes = require("./routes/users-routes");
const HttpError = require("./models/http-error");

const app = express();

//Parse any incoming request body and extract any json data that is in there converted to regular javascript data structure (object,array...) and than call next autometically to reach the next middleware inline
app.use(bodyParser.json());

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept, Authorization"
  );
  res.setHeader("Access-Control-Allow-Methods", "GET, POST, PATCH, DELETE");

  next();
});

app.use("/api/places/", placesRoutes); //place route

app.use("/api/users/", usersRoutes); //user route

//run only if the other routes did not send a respond
app.use((req, res, next) => {
  const error = new HttpError("Could not find this route.", 404);
  throw error;
});

app.use((error, req, res, next) => {
  //this function will execute if any middleware Infront of it yields an error
  if (res.headerSent) {
    //check if respond already has been sent
    return next(error);
  }
  //if code properties is set or default 500 => error code that something went wrong
  res.status(error.code || 500);
  res.json({ message: error.message || "An unknown error occurred!" });
});

mongoose
  .connect(
    "something"
  )
  .then(() => {
    app.listen(5000);
    console.log("connected");
  })
  .catch((err) => {
    console.log(err);
  });

• and my error:

• Full description of the error if you can't see the image:

  Access to fetch at 'http://localhost:5000/api/users/signup' from origin 'http://localhost:3000' has been blocked by CORS policy: Request header field contend-type is not allowed by Access-Control-Allow-Headers in preflight response.

  POST http://localhost:5000/api/users/signup net::ERR_FAILED

  TypeError: Failed to fetchat authSubmitHandler (Auth.js:74:1)at HTMLUnknownElement.callCallback (react-dom.development.js:189:1)at Object.invokeGuardedCallbackDev (react-dom.development.js:238:1)at invokeGuardedCallback (react-dom.development.js:291:1)at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:306:1)at executeDispatch (react-dom.development.js:391:1)at executeDispatchesInOrder (react-dom.development.js:416:1)at executeDispatchesAndRelease (react-dom.development.js:3300:1)at executeDispatchesAndReleaseTopLevel (react-dom.development.js:3309:1)at forEachAccumulated (react-dom.development.js:3281:1)at runEventsInBatch (react-dom.development.js:3326:1)at runExtractedPluginEventsInBatch (react-dom.development.js:3536:1)at handleTopLevel (react-dom.development.js:3580:1)at batchedEventUpdates$1 (react-dom.development.js:21726:1)at batchedEventUpdates (react-dom.development.js:798:1)at dispatchEventForLegacyPluginEventSystem (react-dom.development.js:3590:1)at attemptToDispatchEvent (react-dom.development.js:4310:1)at dispatchEvent (react-dom.development.js:4231:1)at unstable_runWithPriority (scheduler.development.js:656:1)at runWithPriority$1 (react-dom.development.js:11076:1)at discreteUpdates$1 (react-dom.development.js:21743:1)at discreteUpdates (react-dom.development.js:811:1)at dispatchDiscreteEvent (react-dom.development.js:4210:1)