起因:http是無狀態(tài)的宫仗,因此我們通常需要用到cookie以及session來保存狀態(tài),session是在服務(wù)器端存儲的旁仿,會和cookie一起使用藕夫,設(shè)置了session之后,會發(fā)送給瀏覽器一個cookie,這個cookie是session_id枯冈,當(dāng)再次請求的時候瀏覽器會將它發(fā)送給服務(wù)器毅贮,以此來找到對應(yīng)的session.?
但是,我們實際使用的時候通常會用到跨域尘奏,就是向不同的域發(fā)起請求滩褥,但是默認(rèn)情況下此時cookie是不會發(fā)送給服務(wù)器的,此時就導(dǎo)致了丟失session_id,從而導(dǎo)致了session的值為undefined炫加。解決方案如下:?
首先瑰煎,前端main.js頁面設(shè)置withCredentials為true铺然,使請求頭可以攜帶cookie:
axios.defaults.withCredentials = true
這里后臺語言是node.js
app.all('*', function(req, res, next) {
????res.header("Access-Control-Allow-Origin",?"這里填可以跨域訪問的域,不能填*哦");
????res.header("Access-Control-Allow-Headers",?"X-Requested-With");
????res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
????res.header("X-Powered-By",' 3.2.1');
????res.header("Access-Control-Allow-Credentials",true);
????res.header("Content-Type",?"application/json;charset=utf-8");
????next();
});
php同理
? ?header('Content-Type: text/html;charset=utf-8');
? ? header('Access-Control-Allow-Origin:*'); // 這里填可以跨域訪問的域酒甸,不能填*哦
? ? header('Access-Control-Allow-Methods:POST,GET,OPTIONS,DELETE'); // 允許請求的類型
? ? header('Access-Control-Allow-Credentials: true'); // 設(shè)置是否允許發(fā)送 cookies
? ? header('Access-Control-Allow-Headers: Content-Type,Content-Length,Accept-Encoding,X- ? ? ? ? ? ? ? ? ?Requested-with, Origin'); // 設(shè)置允許自定義請求頭的字段
而且Access-Control-Allow-Origin不能設(shè)為星號魄健,必須指定明確的,與請求網(wǎng)頁一致的域名插勤。