js 使用ajax设置和获取自定义header信息的方法小结


Posted in Javascript onMarch 12, 2020

本文实例讲述了js 使用ajax设置和获取自定义header信息的方法。分享给大家供大家参考,具体如下:

1、js ajax 设置自定义header

1.1 方法一:

$.ajax({
  type: "POST",
  url: "Handler1.ashx",
  contentType: "application/x-www-form-urlencoded",
  beforeSend: function (request) {
    request.setRequestHeader("token1", "Chenxizhang");
  },
  success: function (data) {
    //your code
  }
});

1.2 方法二:

$.ajax({
  headers: {
    "testheader": "test"
  },
  type: "POST",
  url: "Handler1.ashx",
  contentType: "application/x-www-form-urlencoded",
  success: function (data) {
    //your code
  }
});

2、js ajax 获取请求返回的response的header信息

ajax请求完成,会返回xhr(XMLHTTPRequest)对象,这里面会包含返回的头信息,可以通过getResponseHeader(key)和getAllResponseHeaders()获取header信息;

$.ajax({
  type: "POST",
  url: "Handler1.ashx",
  contentType: "application/x-www-form-urlencoded",
  success: function (data) {
    //your code
  },
  complete: function (xhr, data) {
    /* 
      获取相关Http Response header
      getResponseHeader(key):获取指定头信息
      getAllResponseHeaders():获取全部可默认可获取的头信息
    */
    var date=xhr.getResponseHeader('Date');// 服务器端时间
    
    //获取服务端自定义的header信息
    var stoken = xhr.getResponseHeader('servertoken');
    
    var list = xhr.getAllResponseHeaders();
    console.log(list);
    /*
    date: Fri, 12 Jul 2019 12:41:00 GMT
    content-encoding: gzip
    server: Microsoft-IIS/10.0
    x-aspnet-version: 4.0.30319
    x-powered-by: ASP.NET
    vary: Accept-Encoding
    content-type: text/plain; charset=utf-8
    servertoken: test1
    cache-control: private
    content-length: 129
    */
    
  }
});

3、js ajax 跨域请求的情况下获取自定义的header信息

JS AJAX 跨域请求的时候是不能设置自定义的header信息的,但是是可以在response中获取到服务端自定义的header信息,前提是服务端设置了Access-Control-Expose-Headers;

下面是 ASP.NET 的服务端示例:

public void ProcessRequest(HttpContext context)
{
  context.Response.AddHeader("Access-Control-Allow-Origin", "*");
  context.Response.AddHeader("Access-Control-Allow-Headers", "*");
  context.Response.AddHeader("Access-Control-Allow-Methods", "*");
  //自定义header信息
  context.Response.AddHeader("servertoken", "test");
  context.Response.AddHeader("Access-Control-Expose-Headers", "servertoken");
  context.Response.ContentType = "text/plain";
  context.Response.Write("Hello World");
}

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
20个非常棒的Jquery实用工具 国外文章
Jan 01 Javascript
计算世界完全对称日的js代码,粗糙版
Nov 04 Javascript
js检验密码强度(低中高)附图
Jun 05 Javascript
浅析基于WEB前端页面的页面内容搜索的实现思路
Jun 10 Javascript
Javascript实现可旋转的圆圈实例代码
Aug 04 Javascript
Vue.js双向绑定实现原理详解
Dec 22 Javascript
jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)
Dec 22 Javascript
jQuery中.attr()和.data()的区别分析
Sep 03 jQuery
JS中的多态实例详解
Oct 15 Javascript
Vue.js中关于侦听器(watch)的高级用法示例
May 02 Javascript
详解在React项目中安装并使用Less(用法总结)
Mar 18 Javascript
微信小程序收藏功能的实现代码
Jun 19 Javascript
javascript实现拖拽碰撞检测
Mar 12 #Javascript
原生js实现碰撞检测
Mar 12 #Javascript
vue实现导航标题栏随页面滚动渐隐渐显效果
Mar 12 #Javascript
three.js利用射线Raycaster进行碰撞检测
Mar 12 #Javascript
JS实现碰撞检测效果
Mar 12 #Javascript
使用JS实现动态时钟
Mar 12 #Javascript
Vue使用vue-draggable 插件在不同列表之间拖拽功能
Mar 12 #Javascript
You might like
SESSION信息保存在哪个文件目录下以及能够用来保存什么类型的数据
2012/06/17 PHP
再谈PHP中单双引号的区别详解
2016/06/12 PHP
Laravel 在views中加载公共页面的实现代码
2019/10/22 PHP
Nigma vs Alliance BO5 第四场2.14
2021/03/10 DOTA
firefox浏览器用jquery.uploadify插件上传时报HTTP 302错误
2015/03/01 Javascript
Javascript数组Array基础介绍
2016/03/13 Javascript
javascript字符串对象常用api函数小结(连接,替换,分割,转换等)
2016/09/20 Javascript
Bootstrap模态对话框用法简单示例
2018/08/31 Javascript
vue2.0自定义指令示例代码详解
2019/04/25 Javascript
jdk1.8+vue elementui实现多级菜单功能
2020/09/24 Javascript
为什么JavaScript中0.1 + 0.2 != 0.3
2020/12/03 Javascript
[20:46]Ti4循环赛第三日VG vs DK
2014/07/12 DOTA
低版本中Python除法运算小技巧
2015/04/05 Python
python paramiko模块学习分享
2017/08/23 Python
Python3网络爬虫之使用User Agent和代理IP隐藏身份
2017/11/23 Python
基于tensorflow加载部分层的方法
2018/07/26 Python
PyCharm代码提示忽略大小写设置方法
2018/10/28 Python
python实现对任意大小图片均匀切割的示例
2018/12/05 Python
python中的数组赋值与拷贝的区别详解
2019/11/26 Python
python 使用shutil复制图片的例子
2019/12/13 Python
python模拟点击网页按钮实现方法
2020/02/25 Python
Python requests模块session代码实例
2020/04/14 Python
多个版本的python共存时使用pip的正确做法
2020/10/26 Python
详解HTML5如何使用可选样式表为网站或应用添加黑暗模式
2020/04/07 HTML / CSS
老海军美国官网:Old Navy
2016/09/05 全球购物
世界领先的以旅馆为主的在线预订平台:Hostelworld
2016/10/09 全球购物
澳大利亚游乐场设备品牌:Lifespan Kids
2019/05/24 全球购物
介绍下Lucene建立索引的过程
2016/03/02 面试题
应届毕业生个人求职信范文
2014/01/29 职场文书
人力资源管理毕业求职信
2014/08/05 职场文书
2014领导班子四风剖析对照检查材料思想汇报
2014/09/20 职场文书
2014年组织委员工作总结
2014/12/01 职场文书
使用Django实现商城验证码模块的方法
2021/06/01 Python
使用python创建股票的时间序列可视化分析
2022/03/03 Python
一文搞懂Redis中String数据类型
2022/04/03 Redis
Flink 侧流输出源码示例解析
2022/09/23 Servers