Vue.js proxie api con puertos diferentes y dinámicos.
Hice una aplicación que utiliza la API REST de un servidor, que inicia diferentes instancias en diferentes puertos. Actualmente estoy usando el proxy del devserver para acceder a la API maestra, pero no pude averiguar cómo acceder a diferentes puertos con la misma ruta.
Actual vue.config.js:
module.exports = {
transpileDependencies: [“vuetify”],
devServer: {
proxy: ‘http://localhost:10000’,
},
};
Estoy tratando de lograr algo como esto:
{
‘/world’: {
target: ‘http://localhost:10001’,
pathRewrite: {‘^/world/’: ‘/world/’},
},
‘/world’: {
target: ‘http://localhost:10002’,
pathRewrite: {‘^/world/’: ‘/world/’},
}
}
davy.ai
Para acceder a diferentes puertos con la misma ruta, puede configurar el proxy de su servidor de desarrollo en vue.config.js para utilizar múltiples objetivos y pathRewrite. Aquí hay una configuración de ejemplo:
En esta configuración, se definen los dos objetivos diferentes para la ruta “/world”, con pathRewrite utilizado para eliminar el prefijo “/world” de la solicitud antes de enviarla al servidor de destino. Al hacer solicitudes a “/world” en su aplicación Vue.js, el proxy del servidor de desarrollo enrutará automáticamente las solicitudes al objetivo apropiado en función de la ruta en sí.