Access-Control-Allow-Headers Error using Angular and NodeJS

  angular, express, http, javascript, node.js

Im trying to make a post to my api using a node server, i used the http class to make my headers but even after setting them (aparently corrected) im still getting an "Access-Control-Allow-Headers" what am i doing wrong

This is my app.js (api):

    app.use((req, res, next) =>{
  res.setHeader("Access-Control-Allow-Origin","*");
  res.setHeader("Acces-Control-Allow-Headers","Access-Control-Request-Headers","Origin, X-Requested-With, Content-Type, Accept"  );
  res.setHeader("Acces-Control-Allow-Methods","GET, POST, PATCH, DELETE, OPTIONS");
next();
});
app.post("/api/reportes",(req,res,next)=>{
  const post = new Post({
  });
  res.status(201).json({
    message:'Sended'
  });
});

and this is my post request:

 {
   const post : Huesped = {id:id,adultos:adultos,ninos:ninos,nombre:nombre, estatus:estatus,llegada:llegada,salida:salida,noches:noches,porPagar:porPagar,pendiente:pendiente,origen:origen,habitacion:habitacion, telefono:telefono,email:email,motivo:motivo}
   this.http
     .post<{ message: string }>("http://localhost:3000/api/reportes", post)
     .subscribe(responseData => {
       console.log(responseData.message);
       this.huesped.push(post);
       this.postUpdated.next([...this.huesped]);
     });
 }  

How ever everytime i make the post request the chrome console shows me the CORS error

"Access to XMLHttpRequest at ‘http://localhost:3000/api/reportes’ from origin ‘http://localhost:4200’ has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response."

I dont know what am i doing wrong

Source: Angular Questions

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.