使用vueuse存储、读取cookie

最新推荐文章于 2024-04-16 10:14:12 发布

samate6666

最新推荐文章于 2024-04-16 10:14:12 发布

阅读量1.1k

点赞数 3

文章标签：前端

本文链接：https://blog.csdn.net/samate6666/article/details/126847927

版权

1、安装对应包
两个都要安装，如果第二个报错，可以 npm i ‘@vueuse/integrations’

npm i universal-cookie
npm i @vueuse/integrations

2、引入后直接读取或者设置cookie

import { useCookies } from '@vueuse/integrations/useCookies'

const cookies = useCookies()
cookies.set('admin-token',res.token)
cookies.get('admin-token')

在这里插入图片描述

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

samate6666

关注关注

3
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
使用vueuse存储、读取cookie

使用vueuse快速存储、获取cookie
复制链接

扫一扫

cookie-universal:通用cookie插件，非常适合SSR

05-02

您可以使用cookie-universal在浏览器，节点，连接和表达应用程序中设置，获取和删除cookie。 cookie-universal使用流行的解析cookie。您可以使用cookie-universal-nuxt在客户端和服务器端nuxt应用程序中设置，获取和删除cookie。 cookie-universal-nuxt使用流行的解析cookie。

JS设置cookie、读取cookie

10-22

js设置cookie有很多种方法，包括JS设置cookie、读取cookie，工作中常会用到！下面是详细代码，感兴趣的小伙伴们可以参考一下

参与评论您还未登录，请先登录后发表或查看评论

基于vueUse封装cookie的方法处理token

qq_57076435的博客

09-06

169

【代码】基于vueUse封装cookie的方法处理token。

Cookie Universal：为Web开发打造的全能Cookie管理库

最新发布

gitblog_00094的博客

04-16

418

Cookie Universal：为Web开发打造的全能Cookie管理库项目地址:https://gitcode.com/microcipcip/cookie-universal 在Web开发中，Cookie是实现会话管理和状态持久化的重要工具。然而，处理Cookie有时可能会变得复杂和繁琐。为此，我们向您推荐一个强大的JavaScript库——Cookie Universal，它旨在简化C...

vue项目中使用cookie

romeo12334的博客

08-29

3687

安装vue-cookies包： npm install vue-cookies --save 在main.js中引入：使用require： var Vue = require('vue') Vue.use(require('vue-cookies')) 若支持es6，则： import Vue from 'Vue' import VueCookies from 'vue-cookie...

vue-cookies的使用

weixin_47526134的博客

09-25

373

一、安装vue-cookies npm install vue-cookies --save 二、main.js中引入 import Vue from 'vue'; import VueCookies from "vue-cookies"; Vue.use(VueCookies); 三、在组件页面中设置基本使用方法 // 设置 this.$cookies.set(keyName, value[, expireTimes[, path[, domain[, secure[, sameSi..

vue 中使用 vue-cookie 操作 cookie

Never-Say-Never

01-24

483

安装 npm install vue-cookies --save 在main.js引入 import VueCookies from 'vue-cookies' Vue.use(VueCookies) 使用 this.$cookies.set(keyName, value[, expireTimes[, path[, domain[, secure]]]]) this.$coo...

在Vue中如何使用Cookie

xiaoyuehan007的专栏

07-20

7866

大家好，由于公司忙着赶项目，导致有段时间没有发布新文章了。今天我想跟大家谈谈Cookie的使用。同样，这个Cookie的使用方法是我从公司的项目中抽出来的，为了能让大家看懂，我会尽量写详细点，如果有不明白的盆友，可以加我们的QQ号，我们会远程指导。我们的QQ号：【511387930】。废话少说，我们直接进入正题。一、安装Cookie 在Vue2.0下，这个貌似已经不需要安装了。因为当

vue中使用localstorage来存储页面信息

08-28

Vue 中使用 LocalStorage 存储页面信息在 Vue 中，LocalStorage 是一种常用的客户端存储方式，可以用来存储页面信息、本地数据等。在本文中，我们将详细介绍使用 LocalStorage 存储页面信息的方法，并提供一个完整...

httpwebreqeust读取httponly的cookie方法

08-31

在Web开发中，Cookie是服务器发送到客户端浏览器并存储的一小块数据，用于跟踪用户状态和存储相关信息。然而，有些Cookie被标记为`HttpOnly`，这意味着它们不能通过JavaScript等客户端脚本语言访问，以增加安全性，...

js读取cookie方法总结

10-25

JavaScript中的Cookie是Web开发中用来存储用户数据的一种机制，它允许服务器在用户的浏览器上设置和读取小型文本信息。在JavaScript中，通过`document.cookie`属性可以读取和操作Cookie。这里我们将详细讨论四种常见...

Vue使用localStorage存储数据的方法

10-16

在Vue中使用`localStorage`存储数据，通常遵循以下步骤： 1. **创建数据对象**：首先，你需要创建一个表示评论的数据对象，例如： ```javascript var comment = { id: Date.now(), user: this.user, content: ...

Vue如何使用Cookie?

小诸葛的博客

04-29

334

1.下载依赖（官方文档：https://www.npmjs.com/package/vue-cookies） npm install -g vue-cookies 2.在main.js引入依赖 import Vue from 'vue' import App from './App' import router from './router' import VueCookies from...

Vue操作Cookie

无心

07-08

1724

很简单，安装一下就可以使用了。设置存在时间为60分钟。

vue3 + TS + VueUse 快捷存取操作cookie，存储用户token流程

不染-9732

07-27

1305

vue3 + TS + VueUse 快捷存取操作cookie，存储用户token流程

cookies在在前端（vue）中的使用

m0_58235310的博客

11-08

541

就是一个存储，用来存放你需要的小数据。比如：登录请求成功后得到的token，要有roken才能进行登录保留。在代码中，cookies是指用于存储客户端数据的HTTP cookie。它是一个由服务器发送到用户浏览器并存储在用户计算机上的小型文本文件。每当同一台计算机再次访问同一网站时，服务器将检索并使用先前存储的cookie信息。这些信息可用于多种目的，例如保持用户会话、记住用户偏好或用于安全性和认证等。

cookie的存储使用

F02528的博客

05-05

611

cookie的存储使用借助vueuse官网

vue3.0的usecookies的封装步骤

m0_48127281的博客

11-02

1378

封装vue3的useCookies的步骤

[vue3]封装cookie模块

Madman528的博客

02-27

199

封装token读写

vue3 ts读取主系统cookie数据

06-12

要在 Vue3 TypeScript 中读取主系统的 cookie 数据，您可以使用 JavaScript 中的 document.cookie 属性。这个属性返回一个字符串，其中包含当前网页的所有 cookie。您可以使用字符串操作方法来解析 cookie 并获取所需的数据。以下是一个示例代码片段，它展示了如何在 Vue3 TypeScript 中读取主系统的 cookie 数据： ```typescript // 定义一个接口，用于描述 cookie 数据的结构 interface CookieData { name: string; value: string; expires: string; path: string; domain: string; secure: boolean; } // 读取主系统的 cookie 数据 const cookieString = document.cookie; // 解析 cookie 字符串，并将其转换为一个对象数组 const cookieList = cookieString.split(';').map(cookie => { const [name, value] = cookie.trim().split('='); const expires = undefined; const path = '/'; const domain = undefined; const secure = false; return { name, value, expires, path, domain, secure }; }); // 找到你需要的 cookie 数据 const myCookie = cookieList.find(cookie => cookie.name === 'myCookieName'); // 使用 myCookie 对象中的数据 console.log(myCookie.value); ``` 请注意，此代码片段假定您知道要查找的 cookie 的名称。如果您不知道 cookie 的名称，您可能需要编写代码来遍历 cookieList 数组并查找包含所需数据的 cookie。

“相关推荐”对你有帮助么？

非常没帮助
没帮助
一般
有帮助
非常有帮助

提交