Rumah  >  Artikel  >  hujung hadapan web  >  Cara menggunakan kuki dalam vue3

Cara menggunakan kuki dalam vue3

PHPz
PHPzke hadapan
2023-05-12 14:19:273399semak imbas

Kata Pendahuluan

Tempat yang paling biasa digunakan untuk kuki mungkin untuk menyimpan akaun dan kata laluan pengguna, yang boleh mengelakkan pengguna perlu memasukkan semula setiap kali dia log masuk

1. Pemasangan kuki dalam vue

Masukkan arahan npm install vue-cookies --save dalam terminal untuk memasang kuki Selepas pemasangan, tulis kod berikut dalam fail main.js

import { createApp } from 'vue'
import VueCookies from 'vue-cookies'
 
const app = createApp(App)
 
app.config.globalProperties.$cookies = VueCookies

untuk menggunakan kuki dalam projek.

2. Menetapkan kuki semasa proses log masuk

Oleh kerana pengguna boleh menukar kata laluan mereka, pendekatan biasa saya dalam perniagaan adalah dengan terlebih dahulu menentukan sama ada antara muka log masuk mengembalikan data yang betul (ia betul dan anda boleh log masuk). Jika terdapat kuki, padamkannya dan buat kuki baharu Kodnya adalah seperti berikut

if (ret.code === 200) {
  // 删除之前的cookies
  if($cookies.isKey("xxxxx") ){
     $cookies.remove("xxxxx")
  }
}

dan kemudian simpan semula maklumat log masuk dalam kuki tersebut adalah seperti berikut

// 设置cookies保存的内容
const xxxxx = {
  username: '',
  password: '',
  // 以下还有很多信息
}

Akhir sekali, simpan semula kuki tersebut cookies ke masa sebelumnya Saya tertanya-tanya jika anda telah memikirkannya.

3. Dapatkan kuki yang disimpan sebelum ini di tempat yang diperlukan

Kodnya juga sangat mudah

// 设置cookies的日期为一个月
$cookies.config("1m")
// 设置cookies
$cookies.set("xxxxx",xxxxx); // 前面的为设置cookies的名字,后面为内容

Dengan cara ini, anda boleh mendapatkan kandungan kuki di tempat yang diperlukan .

Atas ialah kandungan terperinci Cara menggunakan kuki dalam vue3. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:yisu.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam