1.前端跨域问题?
同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能
所谓同源是指: 协议,域名,端口都相同,就是同源, 否则就是跨域http://127.0.0.1:8080
http://127.0.0.1:8080 // 同源http://127.0.0.1:8080
http://127.0.0.1:9090 // 跨域2.利用webpack-dev-server代理解决跨域问题devServer: {
contentBase: "./dist",
open: true,
port: 9090,
proxy: {
// 所有API开头的请求都会被代理到target
// 例如: 我们发送请求地址: http://127.0.0.1:9090/api
// 实际发送请求地址: http://127.0.0.1:3000/api
"/api": {
target: "http://127.0.0.1:3000", // 代理地址
changeOrigin: true, // 域名跨域
secure: false, // https跨域}
}
}
devServer: {
contentBase: "./dist",
open: true,
port: 9090,
proxy: [{
context:["/api", "/login"],
target: "http://127.0.0.1:3000", // 代理地址
changeOrigin: true, // 域名跨域
secure: false, // https跨域}]
}
3.利用webpack-dev-server重写请求路径proxy: [{
context:["/api", "/login"],
target: "http://127.0.0.1:3000", // 代理地址
changeOrigin: true, // 域名跨域
secure: false, // https跨域
pathRewrite:{"^/api": ""} // 路径重写, 将路径中的api替换为空
}]