【JavaScript】获取指定的url后端返回的header头里的数据_js获取response header数据

想要获取指定的url的header头，只能在拦截器过滤。
一开始准备直接过滤所有的拦截信息然后把需要的url信息存到本地，
再通过再次在页面请求接口保存header头

Vue.http.interceptors.push(function(request, next) {
  if(request.url.indexOf('slice/by/pathology')!== -1){
    sessionStorage.setItem('pathology_url',request.url)
    sessionStorage.setItem('pathology_params',JSON.stringify(request.params))
    //储存需要用JSON.stringify转化一下
  }
  ...
 } 

getHeaders(){
    var url = sessionStorage.getItem('pathology_url')+'?pathology_id='+JSON.parse(sessionStorage.getItem('pathology_params')).pathology_id
    var req = new XMLHttpRequest();
    req.open('GET', url, false);
    req.send(null);
    var headerArr = req.getAllResponseHeaders().split('\n');
    var headers = {};
    headerArr.forEach(item => {
      if (item !== '') {
        var index = item.indexOf(':');
        var key = item.slice(0, index);
        var value = item.slice(index + 1).trim();
        headers[key] = value
      }
    })
    this.next = window.atob(headers.next)//此处后端用base64加密了
    this.prev = window.atob(headers.prev)
  },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

但是这样太不优雅了
可以直接过滤需要的url然后修改返回值。在调取接口时直接取用

Vue.http.interceptors.push(function(request, next) {
  request.timeout = request.timeout ?? 10000;
  const logLevel = request.headers.get('X-Custom-Log-Level');
  next(function(response) {
    if (response?.status === 0) {
     ...
    } else if (response?.status === 401) {
     ...
    } else if (!validStatus.contains(response.status) && logLevel !== 'DEBUG') {
     ...
    }else{
      if(request.url.indexOf('slice/by/pathology')!== -1){
        response.data.prev = response.headers.map.prev;
        response.data.next = response.headers.map.next;
      }
      next();
    }
  });
});

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20