先直接在后端加上@CrossOrigin看行不行,加了之后发现莫名奇妙微服务访问得了,网关却无法访问,但postman测试通过,所以觉得还是跨域的问题,最后再配置前端的跨域配置,这里使用的是vue3,再vue.config.js中加入了proxy的配置
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
devServer:{
proxy: {
'/api': {
target: 'http://localhost:50000', // 目标服务器地址
changeOrigin: true, // 是否改变源地址
pathRewrite: {
'^/api': '' // 重写路径
}
}
}
}
})
第一个/api指匹配所有以/api开头的请求,第二个^/api,也就是属性的字面意思,正则表达式将/api选出来并替换为另一个地址,这里写的空字符串,结果就是删掉了/api,在请求时,写的/api/user/login,实际上请求的地址是
http://localhost:50000/user/login