Блог

Главная - Вопросы по программированию - Приложение, созданное на React (интерфейсе) и Node Express на одном порту (интеграция с Stripe)?

Приложение, созданное на React (интерфейсе) и Node Express на одном порту (интеграция с Stripe)?

#node.js #reactjs #express #stripe-payments

#node.js #reactjs #экспресс #stripe-платежи

Вопрос:

У меня есть существующее приложение для интернет-магазина, созданное с помощью React на интерфейсе, и я пытаюсь интегрировать STRIPE в качестве способа оплаты, используя NODE Express на серверной части. Я хотел бы запустить их на том же порту, и я попробовал с прокси в package.json и, обслуживая index.html как статический файл, но он не работает.

Я обслуживаю index.html как статический файл, но, похоже, он не читает ничего, кроме html. Вот мой код:

server.js

 const express = require('express');
require('dotenv').config('.env');
const stripe = require('stripe')(process.env.STRIPE_SECRET_KEY);
const path = require('path')
import Products from './src/components/Products';
import CartItem from './src/components/context/cartProvider';


const app = express();

// I am trying to serve the whole React app as static file
app.use(express.static('public'));

app.get('/', (req, res) => {
    res.sendFile(path.join(__dirname, 'public', 'index.html'))
  })




// ENDPOINTS FOR SESSION HERE

app.post("/create-checkout-session", async (req, res) => {



    const session = await stripe.checkout.sessions.create({
      payment_method_types: ["card"],
      line_items: [
        // Here we have to send clonedCart[] as body
      ],
      mode: "payment",
      success_url: "https://example.com/success",
      cancel_url: "https://example.com/cancel",
    });
  
    res.json({ id: session.id });
  });  



app.listen(4000, () => console.log('Server is running on port 4000'))

В package.json я добавил следующую строку:

   "proxy": "http://localhost:4000",

Стоит отметить, что React выполняется на порту по умолчанию: 3000

Комментарии:

1. Вам вроде бы не нужен прокси здесь. Из ваших комментариев я предполагаю, что на ваш пакет React нет ссылок в index.html файл, который вы размещаете. Одностраничное приложение React в основном сводится к index.html файл, содержащий пакет JavaScript вашего приложения, который обычно готовится с помощью Webpack. Я бы рекомендовал взглянуть на вас index.html файл и обеспечение того, чтобы он включал ваш пакет приложений. Способ, которым вы обслуживаете статический файл, также кажется немного странным. Обычно вам просто нужна строка типа: app.use('/', express.static(path.join(__dirname, 'public', 'index.html'))); .

Ответ №1:

Обслуживание статического html из node.js серверный код, не будет работать. Поскольку вы используете только html общей папки, его нельзя использовать. Чтобы использовать его, вам нужно использовать версию сборки.

Что я могу понять из вашего вопроса, так это то, что вам нужно запускать их на одном порту, потому что вы можете получать ошибку cors. Поэтому используйте модуль cors.