jquery-ajax发送请求前携带csrf-token

最新推荐文章于 2024-10-17 16:16:05 发布

欲饮琵琶码上催

最新推荐文章于 2024-10-17 16:16:05 发布

阅读量816

点赞数 1

本文链接：https://blog.csdn.net/qq_35081380/article/details/119428337

版权

这篇博客介绍了如何在jQuery的Ajax设置中实现CSRF令牌的获取与更新，以及请求超时的处理。在beforeSend回调中，设置请求头携带CSRF-Token，并在完成请求后更新本地存储的令牌。同时，文中还展示了在complete回调中针对不同状态码进行的错误提示，包括请求超时的错误处理。

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

动态设置，每次都会执行beforeSend

//ajax监听
$.ajaxSetup({
    //请求csrf-token
    beforeSend: function (xhr) {
        xhr.setRequestHeader('X-CSRF-TOKEN', localStorage.getItem('__token__'))
    },
    //请求完毕更新csrf-token
    complete: function (xhr, status) {
        localStorage.setItem('__token__', xhr.getResponseHeader('__token__'));
    }
});

或者直接设置header

$.ajaxSetup({
    timeout: 1000, //超时时间设置，单位毫秒
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    },
    //请求csrf-token
    beforeSend: function (xhr) {

    },
    //请求完毕更新csrf-token
    complete: function (xhr, status) {

        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                if(xhr.responseJSON.code === 10000){
                    Toast.fire({
                        icon: 'error',
                        title: xhr.responseJSON.msg
                    })
                }
            }
        }
        //超时,status还有success,error等值的情况
        if (status === 'timeout') {
            Toast.fire({
                icon: 'error',
                title: "请求超时~"
            })
        }
    }
});