vue2.0 proxy inverso para resolver dominio cruzado (vue configuración de proxy inverso)

¡Hola a todos! Hoy vengo a compartir con ustedes acerca de vue2.0 proxy inverso para resolver el problema de dominio cruzado, es decir, el método de configuración de vue proxy inverso. Espero que pueda ayudarle a resolver algunos problemas en el desarrollo.

vue2.0 proxy inverso para resolver dominio cruzado (vue configuración de proxy inverso)

En primer lugar, hablemos de lo que es cross-domain. En el desarrollo front-end, a menudo nos encontramos con esta situación: cuando nuestro código front-end (como el basado en el desarrollo del framework Vue.js) se despliega en un nombre de dominio, mientras que nuestra interfaz back-end se despliega en otro nombre de dominio, esta vez habrá una situación de cross-domain. En este momento, el navegador evitará que nuestro código front-end acceda a la interfaz bajo un dominio diferente por razones de seguridad, lo que trae algunos problemas a nuestro desarrollo.

Entonces, ¿cómo resolver este problema entre dominios? Se trata de mencionar el proxy inverso de vue2.0. El llamado proxy inverso, como si fuera nuestra pequeña secretaria de la recepción, que recibe a los huéspedes que visitan la recepción, y los huéspedes para encontrar la interfaz de fondo, que le ayudará a transferir, por lo que los huéspedes y el fondo no es necesario hablar directamente, lo que reduce en gran medida la molestia innecesaria.

¿Cómo configurarlo exactamente? Podemos usar proxyTable en el archivo index.js en la carpeta config para configurarlo. Veamos el código de ejemplo:

"`javascript
module.exports = {
dev: {
proxyTable: {
'/api': {
target: 'http://localhost:3000', // introduzca el nombre de dominio de la interfaz backend
changeOrigin: true, // si es entre dominios o no
reescribir ruta: {
'^/api': " // Reescribir la ruta para eliminar /api
}
}
}
}
}
“`

En este código de ejemplo, reenviamos todas las peticiones que empiezan por /api a http://localhost:3000这个域名下 y hacemos alguna reescritura de rutas. De esta forma, nuestro código front-end puede acceder a la interfaz back-end sin ningún problema.

observaciones finales

Mediante la configuración del proxy inverso de vue2.0, hemos resuelto con éxito el problema de cross-domain, de modo que el código front-end puede acceder sin problemas a la interfaz de back-end bajo diferentes nombres de dominio, lo que mejora en gran medida la eficiencia del desarrollo y evita problemas innecesarios. ¡Espero que este pequeño truco puede ayudar a usted, para que en el desarrollo front-end de la carretera cada vez más sin problemas! ¡Ánimo Oh!