最近做了两个后台项目。前端和后端使用的技术没有改变。只是在第一个项目的前端配置了代理转发，第二个项目的前端没有配置。但是这种差异使得项目的联调变得更加容易。有时会出问题。总结一下今天的问题。后端使用cookie来处理登录验证问题。登录成功后，浏览器有一个set-cookie字段，但是浏览器并没有保存cookie。原因是后端在请求时处理了跨域比如机器的ip：192.168.1.66，发送请求的接口是IP：192.168.1.67，如果存在跨域，则后端处理跨域,那么cookie只会保存在67的地址，所以不会保存在66最重要的是我们本地的cookie处理前端使用了代理转发。vue2.x和vue3.x的版本在处理代理转发上有些不同。这里也解释一下：\`vue2.x\`//在config文件下配置index。js//文档见http://vuejs-templates.github.io/webpack。constpath\=require('path')module.exports\={dev:{//路径assetsSubDirectory:'static',assetsPublicPath:'/',proxyTable:{'/v1':{target:'http://192.168.1.24:8000',//请求的地址changeOrigin:true,pathRewrite:{'^/v1':'/v1'}},onProxyReq:function(proxyReq,req,res){//真的不知道代理后的路径，可以在这里打印出来看console.log("原始路径："+req.originalUrl,"代理路径："+req.path)}},//各种DevServer设置host:'localhost',//可以被process.env.HOST覆盖port:8080,//可以over由process.env.PORT写的，如果端口被占用，会判断一个空闲的autoOpenBrowser:false,errorOverlay:true,notifyOnErrors:true,poll:false,//https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-/\*\*\*SourceMaps\*///https://webpack.js.org/configuration/devtool/#developmentdevtool:'cheap-module-eval-source-map',//https://vue-loader.vuejs.org/en/options.html#cachebustingcacheBusting:true,cssSourceMap:true},build:{//index.html模板index:path.resolve(\_\_dirname,'../dist/index.html'),//路径assetsRoot:path.resolve(\_\_dirname,'../dist'),assetsSubDirectory:'static',assetsPublicPath:'/',/\*\*\*SourceMaps\*/productionSourceMap:false,//https://webpack.js.org/configuration/devtool/#productiondevtool:'#source-map',//npminstall--保存开发压缩webpack插件productionGzip:false,productionGzipExtensions:\['js','css'\],bundleAnalyzerReport:process.env.npm\_config\_report}}\`vue3.x\`//直接在vue.config.js中配置module.exports\={//配置代理devServer:{host:"localhost",//要设置当前访问ip，否则会失败//open:true,//浏览器自动打开页面proxy:{'/v1':{target:'http://192.168.1.64:9100/',secure:false,//ws:true,changeOrigin:true,pathRewrite:{'^/v1':'/v1'}}}}//禁用eslintdetectiondevServer:{overlay:{warnings:false,errrors:false}},lintOnSave:false,//使用相对路径打包要价publicPath:'',//不生成map文件productionSourceMap:false,}
