一.問題重述
使用的是，前后端分離，前端vue+axios請求，后端使用node搭建服務端接口，遇到的問題是，我通過登錄接口吧數據存儲型在session，我登錄上以后，發現再次驗證登錄（另一個接口）的時候，
session變為空了，很納悶為什么。
二.項目步驟，
前端部分的改動：
（1）vue使用vue/cli3搭建腳手架，一開始沒有設置代理，各種不行，后來，設置proxy代理，
vue/cli3代理設置的方法：
在項目根目錄新建一個文件夾（就是根目錄新建就行了，官網這么說的）vue.config.js
里面的內容：
module.exports = {
devServer: {
// 設置代理
proxy: {
'/app': {
// 目標 API 地址
target: 'http://localhost:3000/',
// 如果要代理 websockets
ws: true,
// 將主機標頭的原點更改為目標URL
changeOrigin: true,
//這個必須寫啊。。。。（我也不知道為啥，不寫就錯了）
pathRewrite:{
'^/app':""
}
}
}
}
}
然后npm run server 就好了，
請求這么寫：axios.get("/app/api/userInfo/isLogin").then(res => {})
（2）現在還沒改完呢:
// main.js文件下加上這兩句
import axios from 'axios'
axios.defaults.withCredentials=true;
為啥加這個呢，因為axios請求里面，標准的跨域請求是不會發送cookie等用戶認證憑據的。所以，當你再次訪問遠程api的時候，cookie是不會被帶上的，於是乎，服務器理就不會找到同樣的session。MDN上的簡單介紹 credentials 。用XMLHttpRequest請求的時候，我們需要設置屬性 withCredentials=true ;
node端部分的修改：
（1）// app.js里面加上允許跨域
app.use(function (req, res, next) {
res.header("Access-Control-Allow-Credentials", "true");
res.header('Access-Control-Allow-Origin', 'http://localhost:8080');
// res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');
res.header('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
if (req.method == 'OPTIONS') {
res.send(200); /*讓options請求快速返回*/
} else {
next();
}
})
解釋一下標藍的三塊意思：本來沒有res.header("Access-Control-Allow-Credentials", "true"); 這行的，但是不加的話，前端攜帶的cookie就過不來。兩個接口請求的session還是不一樣。
但是請求設置有個限制，一旦設置了res.header("Access-Control-Allow-Credentials", "true"，那么res.header('Access-Control-Allow-Origin', ‘*’);就會在前端報錯。告訴你不能設置成*，
這個origin設置成*的目的是，允許所有的域來跨域訪問數據。這個原因我也不知道為啥，但是可以設置多個，你要跨域的域名。我設置成了res.header('Access-Control-Allow-Origin', 'http://localhost:8080');這一塊的解釋，看這個小哥說的: https://blog.csdn.net/vincent_ling/article/details/51714691
這樣前后端都改后，再次在前端兩個不同的接口訪問后端的req.session，存儲的信息就會一樣了。
