美文网首页
axios get请求如何设置Content-Type

axios get请求如何设置Content-Type

作者: 最爱徐媳妇 | 来源:发表于2019-05-25 10:27 被阅读0次

    最近在工作中碰到一个问题,后端提供的get请求的接口需要在request header 设置Content-Type为 ‘application/json’,于是如下设置:

    const http = axios.create({
      method,
      baseUrl,
      url,
      headers: {
        'Content-Type': 'application/json',
      },
      ...
    })
    

    然而实际使用中发现并没有成功在请求头里设置Content-Type,经过网上的资料查找发现是由于axios的源码出了问题,具体位置在 axios/lib/adapters/xhr.js:

    // Add headers to the request
        if ('setRequestHeader' in request) {
          utils.forEach(requestHeaders, function setRequestHeader(val, key) {
            if (typeof requestData === 'undefined' && key.toLowerCase() === 'content-type') {
              // Remove Content-Type if data is undefined
              delete requestHeaders[key];
            } else {
              // Otherwise add header to the request
              request.setRequestHeader(key, val);
            }
          });
        }
    

    从中可以看出当未设置requestData的时候回删掉Content-Type的设置,其这么做的原因在于是Get请求本身是不需要Content-Type的。
    具体解决方法如下:

    const http = axios.create({
      method,
      baseUrl,
      url,
      headers: {
        'Content-Type': 'application/json',
      },
      ...
    })
    
    http.interceptors.request.use(config => {
      if (config.method === 'get') {
        //  给data赋值以绕过if判断
        config.data = true 
      }
    
      config.headers['Content-Type'] = 'application/json'
      return config
    }, err => Promise.reject(err))
    

    重新调用接口,ok大功告成

    参考资料:
    https://github.com/axios/axios/issues/362
    https://blog.csdn.net/qq_24729895/article/details/80367460

    相关文章

      网友评论

          本文标题:axios get请求如何设置Content-Type

          本文链接:https://www.haomeiwen.com/subject/jrdemftx.html