vue axios sessionID每次請(qǐng)求都不同的原因以及修改方式
vue axios sessionID每次請(qǐng)求都不同的原因
今天應(yīng)項(xiàng)目需要,需要在請(qǐng)求當(dāng)中加入sessionID的驗(yàn)證,但是發(fā)現(xiàn)每一次發(fā)送給后臺(tái)的請(qǐng)求當(dāng)中,sessionID都是不一樣的,那么原因是什么呢?
查閱度娘之后
發(fā)現(xiàn)自己封裝的axios配置文件當(dāng)中,缺少了一行:
import axios from 'axios' axios.defaults.withCredentials = true
這是axios的文檔: https://www.kancloud.cn/yunye/axios/234845
// `withCredentials` 表示跨域請(qǐng)求時(shí)是否需要使用憑證 withCredentials: false, // 默認(rèn)的
在我封裝的axios請(qǐng)求當(dāng)中,是沒(méi)有 withCredentials的配置的, 如果沒(méi)有配置為true,默認(rèn)為false則向后臺(tái)發(fā)送的請(qǐng)求當(dāng)中不攜帶cookie信息,如此每一次sessionID自然會(huì)不同。
而再加入這一行配置之后,再次測(cè)試,發(fā)現(xiàn)出現(xiàn)新的的問(wèn)題:
Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:8080' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
這個(gè)時(shí)候,就需要后臺(tái)的同事幫忙了,在后臺(tái)的跨域請(qǐng)求頭配置當(dāng)中,進(jìn)行如下兩行的配置:
response.setHeader("Access-Control-Allow-Origin", "*");// 不能是通配符*
而是:
作用是將訪問(wèn)接口才ip注冊(cè)進(jìn)去。
第二個(gè)配置是:
Access-Control-Allow-Credentials: true
若是不設(shè)置成這個(gè),也會(huì)出錯(cuò)。
而這樣前后都設(shè)置完畢之后,再次請(qǐng)求,你會(huì)發(fā)現(xiàn),還是出錯(cuò)了,那是因?yàn)椋阈枰谛薷囊粋€(gè)地址
host: 'localhost', // 這里要修改為你本機(jī)的ip地址,那少年,你就成功了 port: 8080, // 端口 autoOpenBrowser: false,
總結(jié)
以上為個(gè)人經(jīng)驗(yàn),希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
詳解vee-validate的使用個(gè)人小結(jié)
本篇文章主要介紹了詳解vee-validate的使用個(gè)人小結(jié),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下。2017-06-06vue打開(kāi)新窗口并實(shí)現(xiàn)傳參的圖文實(shí)例
這篇文章主要給大家介紹了關(guān)于vue打開(kāi)新窗口并實(shí)現(xiàn)傳參的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03vue-video-player實(shí)現(xiàn)實(shí)時(shí)視頻播放方式(監(jiān)控設(shè)備-rtmp流)
這篇文章主要介紹了vue-video-player實(shí)現(xiàn)實(shí)時(shí)視頻播放方式(監(jiān)控設(shè)備-rtmp流),具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-08-08使用websocket和Vue2中的props實(shí)時(shí)更新數(shù)據(jù)方式
這篇文章主要介紹了使用websocket和Vue2中的props實(shí)時(shí)更新數(shù)據(jù)方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-08-08vue中v-for循環(huán)選中點(diǎn)擊的元素并對(duì)該元素添加樣式操作
這篇文章主要介紹了vue中v-for循環(huán)選中點(diǎn)擊的元素并對(duì)該元素添加樣式操作,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-07-07利用vue+turn.js實(shí)現(xiàn)翻書效果完整實(shí)例
這篇文章主要給大家介紹了關(guān)于利用vue+turn.js實(shí)現(xiàn)翻書效果的相關(guān)資料,turn.js是使用了jquery書寫的,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-01-01