NextJS + Pages plugin error

so here is my current code that is located
@/src/app/api/contact/route.ts


import turnstilePlugin from '@cloudflare/pages-plugin-turnstile';
import mailChannelsPlugin from '@cloudflare/pages-plugin-mailchannels';

const { MAIL_EMAIL, MAIL_NAME, MAILTO_EMAIL, MAILTO_NAME, TURNSTILE_SECRET_KEY } = process.env;
if (!MAIL_EMAIL || !MAIL_NAME || !MAILTO_EMAIL || !MAILTO_NAME || !TURNSTILE_SECRET_KEY) {
  throw new Error("Missing .env configuration");
}

interface FormData {
  name: string;
  email: string;
  phone: string;
  message: string;
  token: string;
}

export async function POST(req: Request) {
  if (req.method !== 'POST') {
    return new Response('Method Not Allowed', { status: 405 });
  }
  try {
    const formData = await req.json() as FormData;
    console.log('Received form data:', formData);
    if (!formData.token) {
      return new Response('Token is required', { status: 400 });
    }
    console.log('Rtoken:', formData.token);

    // Verify Turnstile token
    console.log('Verifying Turnstile token...');
    const turnstileResponse = await turnstilePlugin({
      secret: TURNSTILE_SECRET_KEY as string,
      response: formData.token
    });

    if (!turnstileResponse.success) {
      console.error('Turnstile verification failed:', turnstileResponse);
      return new Response('Turnstile verification failed', { status: 403 });
    }
    console.log('Turnstile verification successful.');

    // Prepare email data
    const { token, ...emailData } = formData;
    console.log('Preparing email data:', emailData);
    const emailResponse = await mailChannelsPlugin({
      personalizations: [
        {
          to: [{ name: MAILTO_NAME, email: MAILTO_EMAIL }],
          cc: [{ name: emailData.name, email: emailData.email }],
          subject: 'New Form Submission from ' + emailData.name,
          content: [{
            type: 'text/plain',
            value: 'Form submission details: ' + JSON.stringify(emailData),
          }]
        },
      ],
      from: {
        name: MAIL_NAME,
        email: MAIL_EMAIL,
      },
      respondWith: () => {
        return new Response('Thank you for your message.');
      },
    })

    if (emailResponse.ok) {
      console.log('Email submitted successfully:', emailResponse);
      return new Response('Email submitted successfully', { status: 200 });
    } else {
      console.error('Failed to send email:', emailResponse);
      return new Response('Failed to send email', { status: emailResponse.status });
    }
  } catch (error) {
    console.error('Error occurred in POST function:', error);
    return new Response('An error occurred while processing your request. ' + error, { status: 500 });
  }
};


and i have screenshot the errors i am getting back from the turnstile plugin its triggering on lines 36/37
Was this page helpful?