Vue 中 使用 vue-cookies和vue-session

该博客介绍了在Vue中使用vue-session和vue-cookies的方法。包括使用npm安装这两个工具,在main.js中引入,以及具体的使用方式。同时提醒若要在cookies和session中存入对象,需先转换为json字符串。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

获取全平台资料

一、Vue中使用 vue-session

1.npm 安装  vue-session

npm install vue-session

2.在main.js中引入

import VueSession from 'vue-session'
Vue.use(VueSession)

3.使用

 this.$session.set("key",value); //存session
 this.$session.get("key"); //获取session

二、Vue中使用vue-cookies

1.npm  安装 vue-cookies

npm install vue-cookies --save

2.在main.js中引入

import VueCookies from 'vue-cookies'
Vue.use(VueCookies);

3.使用

 this.$cookies.set("key",value); //存cookies
 this.$cookies.get("key"); //获取cookies

4.注意:如果想在cookies和session中存入的是对象是,需要先转换为json字符串

来源:vue-cookies - npm

           vue-session - npm

Vue 项目中,可以使用 token、session cookie 进行用户认证授权。 1. Token Token 是一种无状态的认证方式,客户端通过用户名密码向服务器发起请求,服务器验证成功后生成一个 token 并返回给客户端,客户端储存 token 后在每次请求时携带该 token,服务器通过验证 token 来识别用户身份。 在 Vue 项目中,可以使用 axios 库进行网络请求,并在请求头中添加 token: ```javascript axios.defaults.headers.common['Authorization'] = `Bearer ${token}` ``` 2. Session Session 是一种有状态的认证方式,用户在登录后,服务器会在后端为该用户创建一个 Session ID,并将该 ID 存储session 中,然后将该 ID 返回给客户端,客户端在每次请求时携带该 Session ID,服务器通过验证 Session ID 来识别用户身份。 在 Vue 项目中,可以使用 axios 库进行网络请求,并在请求头中添加 Session ID: ```javascript axios.defaults.headers.common['Cookie'] = `JSESSIONID=${sessionId}` ``` 3. Cookie Cookie 是一种客户端存储的认证方式,客户端在登录后,服务器会返回一个包含认证信息的 Cookie,客户端在每次请求时都会携带该 Cookie,服务器通过解析 Cookie 来识别用户身份。 在 Vue 项目中,可以使用 js-cookie 库进行 Cookie 的设置读取: ```javascript import Cookies from 'js-cookie' // 设置 Cookie Cookies.set('token', token) // 读取 Cookie const token = Cookies.get('token') ``` 以上是在 Vue 项目中使用 token、session cookie 进行用户认证授权的方法,具体使用哪种方式,可以根据项目的需求安全性来选择。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值