axios cookie一直有效

原创

mob64ca12e0c608 2024-03-08 04:49:53 ©著作权

©著作权归作者所有：来自51CTO博客作者mob64ca12e0c608的原创作品，请联系作者获取转载授权，否则将追究法律责任

实现“axios cookie一直有效”的方法

概述

在使用axios发送请求时，我们通常会遇到cookie过期的问题，导致需要重新登录。为了使axios中的cookie一直有效，我们需要通过设置axios的拦截器来实现。

流程图

erDiagram
    用户 -- 登录: 登录
    登录 -- 设置cookie: 设置cookie
    设置cookie -- 发送请求: 发送请求

详细步骤

下面将详细介绍如何实现“axios cookie一直有效”的方法。

1. 登录

首先，用户需要登录系统，获取到有效的cookie。

// 代码示例
axios.post('/login', {
    username: 'username',
    password: 'password'
}).then(response => {
    // 登录成功，保存cookie
    // 可以通过response.headers['set-cookie']获取到cookie值
}).catch(error => {
    console.error(error);
});

2. 设置cookie

接下来，我们需要将获取到的cookie设置到axios的默认配置中。

// 代码示例
axios.defaults.headers.common['Cookie'] = 'cookie'; // 将获取到的cookie设置到默认请求头中

3. 发送请求

最后，用户在发送请求时，axios会自动携带设置好的cookie，以保证cookie一直有效。

// 代码示例
axios.get('/api/data')
    .then(response => {
        console.log(response.data);
    })
    .catch(error => {
        console.error(error);
    });