Блог

Я пытаюсь отправить данные из формы (react) в свой серверный сервер (nodejs / express), но я получаю ошибку 404. Здесь много кода, поэтому я попытался опубликовать только то, что важно.

Функция для отправки

   //submit data
  const submitCard = (ev) => {
    console.log(ev);
    ev.preventDefault();

    try {
      api.post('/api/stripe/', payment).then((result) => {
        window.location.href = process.env.REACT_APP_REDIRECT_URI;
      });
    } catch (e) {
      console.log(e);
    }
  };

 

отправляемые данные

   const paymentUpdated = () => {
    setPayment({
      name: name,
      firstName: firstName,
      lastName: lastName,
      cardNumber: number,
      expDate: expiry,
      cvc: cvc,
      zip: zip,
      plan: plan,
    });
  };
 

тег формы кнопка

 <form className="creditForm" onSubmit={submitCard}>
<Button className="save-button" type="submit">
 

отправляется маршрут (все еще требуется отправить данные в stripe)

  app.post('/api/stripe', requireLogin, async (req, res) => {
    const plan = await stripe.plans.retrieve('price_1HfAZGGFN31Q4RRjSrFXnGgD');
    console.log(req);
    if (req.user.stripeId) {
      const customer = await stripe.customers.retrieve(req.user.stripeId);
    } else {
      const customer = await stripe.customers.create({
        email: req.user.email,
        description: 'Subscribing to Personal Plan Monthly Subscription',
      });
      req.user.stripeId = customer.id;
      const user = await req.user.save();
    }
    req.user.plan = 2;
    const user = await req.user.save();
    const subscription = await stripe.subscriptions.create({
      customer: req.user.stripeId,
      items: [{ price: 'price_1HfAZGGFN31Q4RRjSrFXnGgD' }],
    });
 

Похоже, что существует несоответствие в URL-адресе, на который вы отправляете, и в том, который настроен в express. Ваша публикация в /api/stripe/ , но express настроен для прослушивания /api/stripe , обратите внимание на отсутствие завершающего / элемента в express. Таким образом, он не находит ожидаемую конечную точку.

Я обычно тестирую свои API-интерфейсы с помощью curl команд, например

 curl -X POST "http://localhost:3500/api/stripe/" -H  "content-type: application/json" -d '{"key1": "value1", "key2": "value 2"}'
 

Как только я докажу, что API работает, только тогда я буду беспокоиться о вызове его из приложения. Это облегчит определение того, в чем заключается проблема в вашем коде.