Express how do I get the values of headers - node.js

Question

I have this problem, it turns out that I need to access the header data that is enclosed in red (Form Data), however, I can only access the information in orange (Request Headers). I need it to send information from the pdf file that is rendered on the frontend (nextjs). The library I'm using for the pdf is Kendo React, and the "proxyURL" prop is the only thing, in my opinion, that helps me send information to the backend.
Request Headers and Form Data
Target Proxy
This is the capture of the req.headers console.log, what I need is out of it, I have been seeing more than 4 hours how to access Form Data. Thanks You Very Much
Log req.headers
Attached the server code the proxy is on line 67
const express = require('express');
const { ApolloServer } = require('apollo-server-express');
const typeDefs = require('./db/schema');
const resolvers = require('./db/resolvers');
const {
GraphQLUpload,
graphqlUploadExpress, // A Koa implementation is also exported.
} = require('graphql-upload');
const jwt = require('jsonwebtoken')
const conectarDB = require('./config/db');
const { bootstrap: bootstrapGlobalAgent } = require('global-agent');
const cors = require("cors");
require('dotenv').config({path: 'variables.env'});
conectarDB();
bootstrapGlobalAgent();
// const corsOptions = {
// origin: process.env.PAGINA,
// optionsSuccessStatus: 200, // some legacy browsers (IE11, various SmartTVs) choke on 204
// credentials: true
// }
async function startServer() {
const server = new ApolloServer({
typeDefs,
resolvers,
cors: {
credentials:true,
origin: process.env.PAGINA,
optionsSuccessStatus:200
},
context: ({req}) => {
// // console.log(req.headers['authorization']);
const token = req.headers['authorization'] || '';
// console.log("headers", req.headers);
if (token) {
try {
const usuario = jwt.verify(token.replace('Bearer ', ''), process.env.SECRETA )
console.log(usuario);
return {
usuario
}
} catch (error) {
console.log("HUBO UN ERROR");
console.log(error.message);
}
}
}
});
await server.start();
const app = express();
// process.env.PAGINA
try {
app.use(graphqlUploadExpress());
app.use(express.static('public'));
// PROXY
app.all("/pdf", (req, res, ) => {
console.log("header", req.headers);
res.send('Data')
})
server.applyMiddleware({ app });
app.use(cors({
origin: process.env.PAGINA,
credentials: true,
optionsSuccessStatus:200
}))
// app.use((req, res, next) => {
// res.header("Access-Control-Allow-Origin", "*");
// res.header(
// "Access-Control-Allow-Headers",
// "Origin, X-Requested-With, Content-Type, Accept, Authorization"
// );
// if (req.method == "OPTIONS") {
// const awa = res.status(200).json({})
// const data = JSON.stringify(awa);
// console.log("data", data);
// console.log("uwuw", res.status(200).json({}));
// return res.status(200).json({});
// }
// next();
// });
// app.use(cors(corsOptions))
// await new Promise(r => app.listen({ port: process.env.PORT || 4000 }, r));
// console.log(`🚀 Server ready at http://localhost:${process.env.PORT || 4000}${server.graphqlPath}`);
// Arrancar el servidor
app.listen({ port: process.env.PORT || 4000}, () => {
console.log(`Servidor corriendo http://localhost:${process.env.PORT || 4000}${server.graphqlPath}`);
})
} catch (error) {
console.log(error);
}
// This middleware should be added before calling `applyMiddleware`.
}
startServer();
And the PDFExport component
<>
<PDFExport forceProxy={true} proxyURL={`http://localhost:4000/pdf`} proxyTarget={`Data`} ref={pdfExportComponent} paperSize="A4" fileName="archivo" key="archivo" >
<div className="body__container" ref={container}>
<header className="header__container">
<h1 className="header__title">PRESUPUESTO</h1>
<div className="header__image"></div>
</header>
<div className="section__body">
<p>Datos del paciente</p>
<h4>
Nombre: <label> {nombre}</label>
</h4>
<h4>
Apellido: <label>{apellido} </label>
</h4>
<h4>
Tipo doc: <label>{tipDoc}</label>
</h4>
<h4>
Numero doc: <label>{docNum}</label>
</h4>
<h4>
Fecha:{" "}
<label>
{dia}-{String(mes).length === 1 ? `0${mes}` : mes}-{year}
</label>
</h4>
</div>
<div className="table__container">
<Table size="sm">
<thead>
<tr>
<th className="table-cabecera-id">N°</th>
<th className="table-cabecera-categoria">Categoría</th>
<th className="table-cabecera-tratamiento">Tratamiento</th>
<th className="table-cabecera">Cantidad</th>
<th className="table-cabecera">C/U</th>
<th className="table-cabecera">Descuento</th>
<th className="table-cabecera">Costo</th>
</tr>
</thead>
<tbody>
{presupuesto.map((item, index) => (
<tr key={item.id}>
<td className="table-elementos">{index + 1}</td>
<td className="table-elementos" lang="es">
{item.categoria}
</td>
<td className="table-elementos" lang="es">
{item.tratamiento}
</td>
<td className="table-elementos">{item.cantidad}</td>
<td className="table-elementos">{item.precio}</td>
<td className="table-elementos">{item.descuento}</td>
<td className="table-elementos">
{item.precio * item.cantidad - item.descuento}
</td>
</tr>
))}
</tbody>
</Table>
</div>
<div className="footer">
<div className="footer__resumen">
<h4>Subtotal:</h4>
<label>S/{sumaSub}</label>
</div>
<div className="footer__resumen">
<h4>Descuento:</h4>
<label>{sumaDesc}%</label>
</div>
<div className="footer__resumen">
<h4>Total: </h4>
<label>S/{montoTotal}</label>
</div>
</div>
<div className="body__doctor">
<h4>Atentamente, Dr. {doctor.nombre} {doctor.apellido}.</h4>
</div>
<div className="footer__contacto">
<div className="footer__contacto-datos">
<h4 className="datos__title">
ODONTO<label>TRENDS</label>
</h4>
<h4>92034933838</h4>
<h4>
Direccion:{" "}
<p className="datos__direccion">
Av. Angelica Gamarra 561 Urb El Trebal - Los Olivos LIMA
</p>
</h4>
<h4>
Telefono: <p>920411227</p>
</h4>
</div>
<div className="footer__contacto-sociales">
<h4 className="footer__contacto-title">Redes sociales</h4>
<div className="sociales__container">
<h4>Odontotrends</h4>
<div className="sociales-facebook"></div>
</div>
<div className="sociales__container">
<h4>odonto_trends</h4>
<div className="sociales-instagram"></div>
</div>
<div className="sociales__container">
<h4>977 182 001</h4>
<div className="sociales-whatsapp"></div>
</div>
</div>
</div>
</div>
</PDFExport>
</>

Answer 1

A POST request puts the data in the request body, not as a header. Your request handler that is handling that POST request will need to read and parse the body of the request.
If this is a form post and you're using Express, then you would install the appropriate middleware - probably app.use(express.urlencoded()). Then your form values would be in req.body.
If the data is an uploaded file, then you may need additional middleware to parse the mime body such as multer.