Configurar múltiples soluciones de servidor en el proyecto vue
solución
- Configuración de Vue.config.js
devServer: {
port: 3000,
proxy: {
// 第一台服务器配置
'/cgi': {
target: 'http://localhost:8005',
ws: true,
changeOrigin: true,
pathRewrite: {
'^/cgi': '/cgi'
}
},
// 第二台服务器配置
'/': {
target: 'http://localhost:8006',
ws: true,
changeOrigin: true,
pathRewrite: {
'^/': '/'
}
}
}
}
- modificación de axios
const BASE_URL = ''
// 创建 axios 实例
const service = axios.create({
baseURL: BASE_URL,
timeout: 5000 ,// 请求超时时间
headers: {
'Content-Type': contentType,
},
})
- Enviar petición
// 请求前缀为"/"
axios.get("/get_pkg_info").then(res => {
console.log('/', res)
}).catch(err => {
console.log(err)
})
// 请求前缀为"/cgi"
axios.get("/cgi").then(res => {
console.log('/cgi', res)
}).catch(err => {
console.log(err)
})
Nota: En el caso de varios servicios de interfaz, si el prefijo es "/", debe colocarse en la primera parte de la configuración del proxy. Cuando se utiliza el proxy, se busca de arriba a abajo. Si se coloca en el abajo, el resto de los servicios también se utilizarán. Configurar proxy desactivado