Search code examples
reactjsreporting-servicescors

Request header field content-type is not allowed by Access-Control-Allow-Headers


Access to XMLHttpRequest at 'http://127.0.0.1:8000/dreams/api/user/signup' from origin 'http://localhost:3000' has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

This project is a reactjs project. I was tired of looking at many YouTube videos and websites. I can't figure out how to apply express and cross method.

error message in user interface

enter image description here

API requst code

enter image description here

This project is a reactjs project. I was tired of looking at many YouTube videos and websites. I can't figure out how to apply express and cross method. I need to skip the "Access-Control-Allow-Headers" which cross the error message.


Solution

  • cors should be added to the backend:

    npm install cors
    
    var express = require('express')
    var cors = require("cors")
    var app = express()
    app.use(cors())