jQuery Ajax 设置请求头

7,282次阅读
没有评论

共计 938 个字符,预计需要花费 3 分钟才能阅读完成。

在项目中采用 token 来验证用户登录,运作机制大致如下

用户首次登录成功时,server-end 发送 token 到 client,client 存入 cookie。

用户做任何请求操作时,在 ajax 的 headers 里带上 token,用以 server-end 做登录状态验证。

 请求
$.ajax({
          type: type,
          timeout: 10000, // 超时时间 10 秒
          headers: {'Access-Token':$.cookie('access_token')
          },
          url: url,
          data: data,
          success: function(data) { },
          error: function(err) { },
          complete: function(XMLHttpRequest, status) {// 请求完成后最终执行参数}
      })

报错:

Request header field Access-Token is not allowed by Access-Control-Allow-Headers in preflight response.
1
其中 Access-Control-Allow-Headers 首部字段用于预检请求的响应。其指明了实际请求中允许携带的首部字段。参考 MDN

查阅了很多参考资料以及各位前辈踩坑记录,得到如下总结:

报错意思是请求头中的 Access-Token 字段在 Access-Control-Allow-Headers 中没有被设置为允许.
谁来设置?

一种是 font-end 自己设置,在 ajax 在中设置 beforeSend

$.ajax({
         type: type,
         timeout: 10000, 
         beforeSend: function(xhr) {xhr.setRequestHeader("Access-Toke");
         },
         headers: {'Access-Token':$.cookie('access_token')
         },
         url: url,
         data: data,
         success: function(data) { },
         error: function(err) { },
         complete: function(XMLHttpRequest, status) {// 请求完成后最终执行参数}
});

希望对大家有所帮助

原文地址: jQuery Ajax 设置请求头

    正文完
     0
    Yojack
    版权声明:本篇文章由 Yojack 于2024-10-07发表,共计938字。
    转载说明:
    1 本网站名称:优杰开发笔记
    2 本站永久网址:https://yojack.cn
    3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
    4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
    5 本站所有内容均可转载及分享, 但请注明出处
    6 我们始终尊重原创作者的版权,所有文章在发布时,均尽可能注明出处与作者。
    7 站长邮箱:laylwenl@gmail.com
    评论(没有评论)