javascriptgetvercel

Why does my Vercel serverless function fail to read request headers in production?


I am working on a Vercel project with both a local development environment (using vercel dev) and a production environment deployed on Vercel's serverless platform.

I need to send credentials (email, pwd, and id) via request headers in a GET request. This works perfectly in my local environment, but in production, I get the following error:

Error: TypeError: Cannot read properties of undefined (reading 'email')
    at module.exports (/var/task/api/user/user.js:16:16)
    at Server.<anonymous> (/opt/rust/nodejs.js:2:11027)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Server.<anonymous> (/opt/rust/nodejs.js:9:6760)

The error occurs here:

  let email, pwd, userId;

  try {
    email = req.body.email || req.headers["email"] || req.headers?.email || null;
    pwd = req.body.pwd || req.headers["pwd"] || req.headers?.pwd || null;
    userId = req.body.participantId || req.headers["id"] || req.headers?.id || null;
  } catch (err) {
    console.error("Error parsing input:", err);
    return res.status(400).json("Bad Request");
  }

Client side GET-request:

axios.get(`/api/user/user/`, {headers: { "email": email, "pwd": pwd, id: participantId }}, { withCredentials: true })
                    .then((res) => res.data.fullName)
                    .catch((err) => {
                        console.log(err);
                        return "Error loading participant";
                    })

Debugging steps I tried:

  1. Logging req.headers both locally and in prod
    • I see email, pwd and id both with the correct value
  2. I ensured header names were case-insensitive in the serverless function
  3. Verified that Axios is sending headers correctly

Observations:

Questions:

  1. Why does the serverless function fail to read headers in production?
  2. Is there a known issue with Vercel's serverless environment stripping certain headers?
  3. How can I ensure the headers (email, pwd, id) are properly passed and read in production?

Thanks in advance I appriciate your help


Solution

  • In this code:

    let email, pwd, userId;
    
    try {
       email = req.body.email || req.headers["email"] || req.headers?.email || null;
       pwd = req.body.pwd || req.headers["pwd"] || req.headers?.pwd || null;
       userId = req.body.participantId || req.headers["id"] || req.headers?.id || null;
    } catch (err) {
       console.error("Error parsing input:", err);
       return res.status(400).json("Bad Request");
    }
    

    You are trying to access req.body.email and req.body.pwd and req.body.userId as the first part of your variable assignments. If you are not using a body-parser to parse incoming POST requests then req.body will not be accessible. By default, it is undefined. That means when you try req.body.email it's throwing an error straight away since undefined cannot have a property named email.

    You are sending a GET request with axios so you can just remove the req.body.xyz parts or move them before the || null default if you think you might use a POST request further down the line in your app development.

    In the first instance I would just refactor your code to remove them like so:

    let email, pwd, userId;
    
    try {
       email = req.headers["email"] || req.headers?.email || null;
       pwd =  req.headers["pwd"] || req.headers?.pwd || null;
       userId = req.headers["id"] || req.headers?.id || null;
    } catch (err) {
       console.error("Error parsing input:", err);
       return res.status(400).json("Bad Request");
    }