Pure js implements getJSON with X-Requested-With header
用纯js实现jquery里面的getJSON方法在网上是有比较多的资料的， 比如在You Might Not Need Jquery中，就有如下实现：
// jquery
$.getJSON('/my/url', function(data) {
});
// pure js
var request = new XMLHttpRequest();
request.open('GET', '/my/url', true);
request.onload = function() {
if (this.status >= 200 && this.status < 400) {
// Success!
var data = JSON.parse(this.response);
} else {
// We reached our target server, but it returned an error
}
};
request.onerror = function() {
// There was a connection error of some sort
};
request.send();但是我在用这段代码异步获取验证码图片时，其效果却和getJSON不一样，
用后者时是可以正常返回结果的，但是用纯js时，后台却返回了404，
对比两次的HTTP请求之后，发现用纯js方法时构造的HTTP请求比用getJSON少了一个Header，
就是X-Requested-With，这是一个很重要的非标准Header，
Wiki解释的比较清楚了，
mainly used to identify Ajax requests. Most JavaScript frameworks send this field with value of
XMLHttpRequest
也就是说这个Header是用来标记请求是否为Ajax的，为什么要这样做呢？
为了防止跨站脚本攻击，也就是大名鼎鼎的CSRF，那么既然如此，需要怎么做呢？
很简单，就是在上面的代码open之后添加如下一行即可：
request.setRequestHeader("X-Requested-With", "XMLHttpRequest");blog comments powered by Disqus