使用Ajax中get請求發送Token時踩的那些坑

在使用慣了各種牛X的插件以后，在使用原生組件寫一些小東西的時候總是有踩不完的坑！

今天就來說一說我使用原生ajax請求時踩得坑：

 下面是我的代碼：

var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.setRequestHeader('Authorization', Token);

xmlhttp.open("GET", url, true); 

 xmlhttp.send(); 
xmlhttp.onreadystatechange = function() { 

if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
　　console.log(xmlhttp.responseText) 
}

這時候控制台直接給我報了以下錯誤：

Uncaught DOMException: Failed to execute 'setRequestHeader' on 'XMLHttpRequest': The object's state must be OPENED.

當時我第一時間是以為我寫錯了代碼，再三審查后，確定自己寫了，並且並沒有書寫錯誤我就明白：踩坑了！！

我就去萬能娘搜索了一下錯誤，原來是因為寫錯了順序！沒錯，順序問題！我滴個親娘嘞！千想萬想沒想到是這樣！

正確代碼應該是這樣的：

var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else { // code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.open("GET", url, true); 
xmlhttp.setRequestHeader('Authorization', Token);
 xmlhttp.send(); 
xmlhttp.onreadystatechange = function() { 

if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
　　console.log(xmlhttp.responseText) 
}

就這樣解決了！

當時以為自己寫錯了格式，或者是干脆代碼編寫錯誤，誰想到原來是代碼順序帶來的錯誤。

為了加深記憶，就發表了我的第一篇隨筆，以后請大家多多關照我這個前端新人~

最后說一句：程序猿太難了！！！