API introuvable dans le déploiement de Vercel

Question

J'ai déployé mon application web sur vercel en utilisant github. Le frontend est chargé, mais les requêtes API du frontend ne sont pas trouvées avec 404. Au fait, c'est une application MERN C'est mon vercel.json

{
    "buildCommand": "cd client && npm install && ./node_modules/vite/bin/vite.js build",
    "outputDirectory": "client/dist",
    "framework": "vite",
    "rewrites": [
        {
            "source": "/api/(.*)",
            "destination": "/index.js"
        }
    ]
}

Voici index.js

const express = require("express");
const cors = require("cors");
const mongoose = require("mongoose");
const cookieParser = require('cookie-parser');
const router = require('./router/router');
const setupCronJob = require('./cron');
const fs = require('fs');
require('dotenv').config();

const app = express();
app.use(express.json());
app.use(cookieParser());    // for reading cookies
const allowedOrigins = ['http://127.0.0.1:5173','https://cozy-stay.vercel.app'];
const corsOptions = {
    credentials: true,
    origin: allowedOrigins,
    methods: 'GET, POST, PUT, DELETE',
    allowedHeaders: 'Content-Type, Authorization, Cookie'
};

app.use(cors(corsOptions));

const port = process.env.PORT || 4000;

mongoose.set("strictQuery", false);

mongoose.connect(process.env.MONGO_URL, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
    serverSelectionTimeoutMS: 10000,
}).then(()=> {
    console.log('Connected to database')
}).catch(err=>{
    throw err;
})
setupCronJob();
app.use('/api',router);
app.listen(port);

Voici le répertoire img

Le frontend est déjà disponible mais l'API ne fonctionne pas correctement, je pense que l'API n'est pas encore chargée. S'il vous plaît aidez-moi

Answer 1

Ce qui semble se produire actuellement, c'est que https://cozy-stay.vercel.app/api la demande de chemin est envoyée au serveur frontend au lieu du serveur backend comme on peut s'y attendre :

Request URL: https://cozy-stay.vercel.app/api/all-places
Request Method: GET
Status Code: 404 
Remote Address: 76.76.21.9:443
Referrer Policy: strict-origin-when-cross-origin

Correction 01

Vous pouvez utiliser deux applications Vercel pour le frontend et le backend :

• cozy-stay.vercel.app
• cozy-stay-backend.vercel.app - Utilisez-le comme hôte de votre serveur backend dans votre application frontend.

Correction 02

Vous pouvez exécuter un équilibreur de charge qui envoie toutes les requêtes avec le préfixe /api au backend et d'autres requêtes au frontend. La plateforme IDK vercel prend en charge cette fonctionnalité.