Нет дескриптора запроса POST веб-перехватчика, несмотря на получение запроса OK POST от Stripe в CLI — NextJS 14

Я правильно получаю запросы POST веб-перехватчиков Stripe, но у меня возникли проблемы с обработкой запроса. Есть ли что-то, что мне не хватает? Console.logs не выводятся на терминал.

Вот мой код с описанием того, что я хочу обработать при получении checkout.session.completed из полосы.

./api/webhook/route.ts
import { createClient } from '@supabase/supabase-js';
import { headers } from 'next/headers';
import { NextRequest, NextResponse } from 'next/server';
import { NextApiRequest, NextApiResponse } from 'next';
import Stripe from 'stripe';
import { Resend } from 'resend';
import EmailTemplate from '@/components/email-template';


const resend = new Resend(process.env.NEXT_RESEND_API_KEY);

const supabase = createClient(
  process.env.NEXT_PUBLIC_SUPABASE_URL!,
  process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!
);

const stripe = new Stripe(`${process.env.STRIPE_SECRET_KEY}`, {
  apiVersion: '2023-08-16',
});

//Handling incoming POST req
async function POST(request: NextRequest) {
  try {
    const body = await request.text();
    const endpointSecret = process.env.STRIPE_SECRET_WEBHOOK_KEY!;
    const sig = headers().get('stripe-signature') as string;
    // const sig = headers().get('Stripe-Signature') as string;
    let event: Stripe.Event;
    //read the event data from stripe
    try {
      event = stripe.webhooks.constructEvent(body, sig, endpointSecret);
    } catch (err) {
      return new Response(`Webhook Error: ${err}`, {
        status: 400,
      });
    }
    console.info(`Received event !webhook!: ${event?.type}`);
    // Handle the event: checkout.session.completed
    switch (event.type) {
      case 'checkout.session.completed':
        const session: any = event.data.object;
        console.info('!Checkout session completed!:', session.payment_status);

        // get customer name, email
        const customerEmail = session.customer_details.email;
        const customerName = session.customer_details.name;

        // create the customer in db
        const { data: customer, error: errorCustomer } = await supabase
          .from('Customer')
          .insert({ customerName, customerEmail })
          .select()
          .single();

        if (errorCustomer) throw new Error(errorCustomer.message);

       
        break;
      default:
    }
    return NextResponse.json({ received: true });
  } catch (error) {
    return NextResponse.json({ error }, { status: 400 });
  }
}

async function GET(request: NextApiRequest, response: NextApiResponse) {
  // Bad Request or how ever you want to respond.
  return response.status(400).json({ error: 'Bad Request' });
}

export { POST, GET };

Заранее спасибо.

Получены веб-перехватчики почтовых запросов Stripe CLI — ОК.

checkout.session.completed получен – ОК checkout.session.completed запускает супабазу и дальнейшие действия, которые не происходят, несмотря на правильные ответы POST.

Извините, но мне неясно, какие части этого кода срабатывают, а какие нет. Если вы добавите строку console.info('foo') сразу внутри блока function POST, увидите ли вы ее зарегистрированной?

RyanM 01.05.2024 23:54

Привет @RyanM, ни одна часть кода не запускается, даже если я добавил, как вы сказали, console.info(''foo'). Я могу поделиться с вами тем, что получаю правильные запросы CLI POST, я добавил это в свой пост.

Ehtz 02.05.2024 15:13
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
1
2
51
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я слушал не тот маршрут.

Неверно:

stripe listen --forward-to localhost:3000/api/checkout

Правильный:

stripe listen --forward-to localhost:3000/api/webhook

Другие вопросы по теме

Похожие вопросы