vue-cookies使用方法與vue使用獲取cookie實(shí)現(xiàn)過(guò)程
1.安裝vue-cookies
npm install vue-cookies -S
2.在main.js引入
import VueCookies from "vue-cookies";
Vue.use(VueCookies);
如圖：
3.在vue組件中使用
(如果存入的是對(duì)象，需要先轉(zhuǎn)換為json字符串)
設(shè)置cookies
this.$cookies.set('fileInfoId', to.query.fileInfoId)
如果是在某個(gè)js，例如router.js下使用，如下引入使用即可
import cookies from "vue-cookies";
cookies.set('fileInfoId', to.query.fileInfoId)
4.獲取cookies
this.$cookies.get('fileInfoId')
5.刪除cookies
this.$cookies.remove('fileInfoId');
6.查看cookies
this.$cookies.isKey('fileInfoId') // return false or true
7.獲取所有cookies
this.$cookies.keys() // return a array
8.針對(duì)瀏覽器存在cookie，前端卻獲取不到的問(wèn)題
httpOnly默認(rèn)為true打?qū)μ?hào)√情況下，禁止javascript操作cookie，導(dǎo)致獲取不到，可以讓后端設(shè)置false；
后端使用node+koa，種客戶端一個(gè)cookie，但是在客戶端內(nèi)通過(guò)document.cookie獲取不了此cookie。
經(jīng)查是由于koa通過(guò)ctx.cookies.set(name, value, [options])種的cookie是自動(dòng)默認(rèn)帶httpOnly的，httpOnly是服務(wù)器可訪問(wèn) cookie, 默認(rèn)是 true。
禁止javascript操作cookie（為避免跨域腳本(xss)攻擊，通過(guò)javascript的document.cookie無(wú)法訪問(wèn)帶有HttpOnly標(biāo)記的cookie。）
所以通過(guò)在后端設(shè)置ctx.cookies.set(name, value, {httpOnly:false})關(guān)掉httponly即可。
總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
KeepAlive 是 vue 中的內(nèi)置組件，當(dāng)多個(gè)組件動(dòng)態(tài)切換時(shí)可以對(duì)實(shí)例狀態(tài)進(jìn)行緩存，本文就來(lái)詳細(xì)的介紹一下Vue中KeepAlive內(nèi)置緩存使用，感興趣的可以了解一下2023-10-10
vue解決一個(gè)方法同時(shí)發(fā)送多個(gè)請(qǐng)求的問(wèn)題
今天小編就為大家分享一篇vue解決一個(gè)方法同時(shí)發(fā)送多個(gè)請(qǐng)求的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
解決vue中reader.onload讀取文件的異步問(wèn)題
這篇文章主要介紹了解決vue中reader.onload讀取文件的異步問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
Vue用Export2Excel導(dǎo)出excel,多級(jí)表頭數(shù)據(jù)方式
這篇文章主要介紹了Vue用Export2Excel導(dǎo)出excel,多級(jí)表頭數(shù)據(jù)方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-04-04
本文通過(guò)實(shí)例代碼給大家介紹了Vue axios配置,非常不錯(cuò)，代碼簡(jiǎn)單易懂，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2018-07-07
vue如何把字符串中的所有@內(nèi)容,替換成帶標(biāo)簽的
這篇文章主要介紹了vue如何把字符串中的所有@內(nèi)容,替換成帶標(biāo)簽的問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
Vue開(kāi)發(fā)過(guò)程中遇到的疑惑知識(shí)點(diǎn)總結(jié)
vue是法語(yǔ)中視圖的意思，Vue.js是一個(gè)輕巧、高性能、可組件化的MVVM庫(kù)，同時(shí)擁有非常容易上手的API。下面這篇文章主要給大家總結(jié)了Vue在開(kāi)發(fā)過(guò)程中遇到的疑惑知識(shí)點(diǎn),有需要的朋友可以參考借鑒，下面來(lái)一起看看吧。2017-01-01
拿來(lái)即用的vue旋轉(zhuǎn)木馬組件demo
這篇文章主要為大家介紹了拿來(lái)即用的vue旋轉(zhuǎn)木馬組件demo詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-03-03
這篇文章主要介紹了Vue3 Pinia如何修改全局狀態(tài)變量值問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-05-05
關(guān)于net?6+vue?插件axios?后端接收參數(shù)問(wèn)題
接到這樣一個(gè)項(xiàng)目需求是這樣的，前端vue?必須對(duì)象傳遞后端也必須對(duì)象接收，接下來(lái)通過(guò)本文給大家介紹下net?6+vue?插件axios?后端接收參數(shù)的問(wèn)題,需要的朋友可以參考下2022-01-01