Puse mi aplicación frontend en la carpeta pública para una aplicación node.js y obtengo los datos del formulario usando la siguiente solicitud:
try { await axios.post("/api/v1/contact-form", { name, email, msg, }); }Mi backend está en el puerto 5000 y está manejando la solicitud de la siguiente manera:
app.use("/api/v1/contact-form", submitFormRouter);Funciona perfecto. Obtengo los datos cuando tengo mi aplicación frontend en la carpeta pública node.js.
Mi pregunta es si mi interfaz se ejecuta en un puerto local diferente, por ejemplo, si uso "Cinco servidores" para ejecutar la aplicación de interfaz, ¿cómo reemplazo la siguiente ruta para la publicación?
Interfaz:
try { await axios.post("/api/v1/contact-form", { name, email, msg, }); }back-end:
app.use("/api/v1/contact-form", submitFormRouter) También probé el código usando React, en cuyo caso la interfaz se ejecuta en http://localhost:3000/ y el servidor node.js se ejecuta en 5000 , el código aún funciona y obtengo los datos del formulario. Pero, ¿cómo hago para que funcione para una aplicación frontend que se encuentra en un puerto diferente (sin reaccionar)?
Además, espero que tenga la amabilidad de responder a la siguiente pregunta: ¿Cuál sería el camino una vez que tenga el frontend, digamos en Netlify, mientras que el backend está en Heroku?
¿Cuál sería el camino una vez que tenga el frontend, digamos en Netlify, mientras que el backend está en Heroku?
Supongamos que su Back on Heroku tiene esta URL https://app.herokuapp.com/ y el Front on Netlify este https://app.netlify.com/ . Todo lo que tienes que hacer es darle a tu Front your Back la url, así:
try { await axios.post("https://app.herokuapp.com/api/v1/contact-form", { name, email, msg, }); }Mi pregunta es si mi interfaz se ejecuta en un puerto local diferente, por ejemplo, si uso "Five server" para ejecutar la aplicación de interfaz, ¿cómo puedo...?
En este punto, tiene dos opciones, la más simple es usar una URL completa como la anterior. Supongamos que su Front está en el puerto 3000 y Back en 8080 . Todo lo que tienes que hacer de nuevo es:
try { await axios.post("http://localhost:8080/api/v1/contact-form", { name, email, msg, }); } El segundo es usar un proxy , y esto realmente depende de la estructura y necesidad de sus proyectos.