React项目中jQuery AJAX请求自动添加额外参数的移除方法求助

嘿，这个问题我之前处理过！你遇到的400错误，根源就是代码里的cache: false配置——当你开启这个选项时，jQuery会自动在请求URL末尾追加像?_=1527798208757这样的时间戳参数，目的是强制浏览器不缓存请求结果，但很不巧，这个天气API不接受额外的查询参数，所以直接返回了错误。

最简单的解决方案：移除cache: false配置 #

因为jQuery的AJAX请求默认就是允许缓存的（cache: true是默认值，除了script和jsonp类型的请求），所以你只需要删掉cache: false这一行，或者把它改成cache: true，就能阻止jQuery添加那个多余的参数了。

修改后的getAlerts方法代码如下：

getAlerts(){ 
  $.ajax({ 
    url: 'https://api.weather.gov/alerts/active/zone/AKZ201', 
    dataType: 'json',
    success: function(data){ 
      this.setState({alerts: data}); 
    }.bind(this), 
    error: function(xhr, status, err){ 
      console.log(err); 
    } 
  }); 
}

如果需要禁用缓存又不想修改URL #

要是你确实需要避免浏览器缓存请求结果（比如API数据会实时更新），可以通过设置HTTP请求头的方式来实现，而不是依赖jQuery的cache: false。这样既不会修改请求URL，又能达到禁用缓存的效果：

getAlerts(){ 
  $.ajax({ 
    url: 'https://api.weather.gov/alerts/active/zone/AKZ201', 
    dataType: 'json',
    headers: {
      'Cache-Control': 'no-cache',
      'Pragma': 'no-cache'
    },
    success: function(data){ 
      this.setState({alerts: data}); 
    }.bind(this), 
    error: function(xhr, status, err){ 
      console.log(err); 
    } 
  }); 
}

这两个方案都能解决你遇到的问题，优先推荐第一个，因为更简洁，而且大部分情况下天气警报API的响应本身就不会被浏览器长期缓存。

内容的提问来源于stack exchange，提问作者Victor Rusu