Error: The incoming JSON object does not contain a client_email field (nextjs, vercel) environment variables not working on vercel

  Kiến thức lập trình

I have this simple porject which is a landing page for a company, but it has two forms within it, in each form the data the user enters gets sent to a google sheets, heres the code for how it works:

/api/send-data/route.ts:

import { NextResponse, NextRequest } from "next/server";
import { google } from "googleapis";

const credentials = {
  type: process.env.TYPE,
  project_id: process.env.PROJECT_ID,
  private_key_id: process.env.PRIVATE_KEY_ID,
  private_key: process.env.PRIVATE_KEY,
  client_email: process.env.CLIENT_EMAIL,
  client_id: process.env.CLIENT_ID,
  auth_uri: process.env.AUTH_URI,
  token_uri: process.env.TOKEN_URI,
  auth_provider_x509_cert_url: process.env.AUTH_PROVIDER_X509_CERT_URL,
  client_x509_cert_url: process.env.CLIENT_X509_CERT_URL,
  universe_domain: process.env.UNIVERSE_DOMAIN,
};

const auth = new google.auth.GoogleAuth({
  credentials: credentials,
  scopes: ["https://www.googleapis.com/auth/spreadsheets"],
});

const spreadsheetId = "1Tt03EVfbBKL_31iIC82VNDbti7ZvIbIlYoXYqon5Q8c"; 

export const POST = async (request: NextRequest) => {
  try {
    const { name, email, phone, comment } = await request.json();

    // Validate fields
    if (!name || !email || !phone || !comment) {
      return NextResponse.json({
        message: "Por favor complete todos los campos",
      });
    }

    // Create client
    const authClient = (await auth.getClient()) as any;

    // Instance of Google Sheets API
    const googleSheets = google.sheets({ version: "v4", auth: authClient });

    // Get metadata about spreadsheet
    const metaData = await googleSheets.spreadsheets.get({
      auth: auth,
      spreadsheetId: spreadsheetId,
    });

    // Read rows from spreadsheet
    // const getRows = await googleSheets.spreadsheets.values.get({
    //     auth,
    //     spreadsheetId,
    //     range: 'hoja principal',
    // })

    // Upload data onto the spreadsheet
    await googleSheets.spreadsheets.values.append({
      spreadsheetId,
      range: "hoja principal!A:D",
      valueInputOption: "USER_ENTERED",
      requestBody: {
        values: [[name, email, phone, comment]],
      },
    });

    return NextResponse.json({
      message: metaData.data,
    });
  } catch (error) {
    console.error(error);
    return NextResponse.json({
      status: "404",
      message: "There was an error",
    });
  }
};

And the other one (/api/programs-data/route.ts) is exactly the same but with different fields and env variables

Before deploying it to vercel I tested it locally and everything worked ok, the data was being sento to both sheets on google sheets. Then I uploaded the repository to vercel, set up all the project’s environment variables by importing the .env file, but now it doesn’t work and it gives me this error:

Error: The incoming JSON object does not contain a client_email field
    at i.fromJSON (/var/task/.next/server/chunks/157.js:13:43873)
    at R.fromJSON (/var/task/.next/server/chunks/157.js:13:29063)
    at R._cacheClientFromJSON (/var/task/.next/server/chunks/157.js:13:29139)
    at R.getClient (/var/task/.next/server/chunks/157.js:13:31724)
    at l (/var/task/.next/server/app/api/send-data/route.js:1:2072)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async /var/task/node_modules/next/dist/compiled/next-server/app-route.runtime.prod.js:6:34666
    at async eS.execute (/var/task/node_modules/next/dist/compiled/next-server/app-route.runtime.prod.js:6:25813)
    at async eS.handle (/var/task/node_modules/next/dist/compiled/next-server/app-route.runtime.prod.js:6:35920)
    at async es (/var/task/node_modules/next/dist/compiled/next-server/server.runtime.prod.js:16:25461)

here’s the screenshot

Does someone know what could the issue be here??

The data should be uploaded to the google sheets without any error since I set up the environment variables on vercel too.

Someone suggested to add NEXT_PUBLIC_ prefix to the variables but they contain private keys and accounts and I don’t know if it would be good to do that.

LEAVE A COMMENT