JS基础丨08. ajax请求及其创建

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/CooliYellow/article/details/82941830

 01. http: 用户端和服务器通讯

01. http:  用户端和服务器通讯
	一般是客户端向服务器发送一个请求;
	然后服务器根据这个请求，再给客户端一个响应;
	
	request  ：客户端向服务器发送请求
	response ：服务器根据请求作出的相应响应
	
	Ajax :是一种局部刷新技术; XMLHttpRequest : Ajax的核心;
	可以访问服务器，而不用刷新整个界面;
 
 

02. 创建一个http请求：
	new XMLHttpRequest();//不支持IE6
	new ActiveXObject("Microsoft.XMLHTTP");//支持ie6

 
03. open(参数1, 参数2, 参数3): 准备请求
	参数1  表示请求方式！GET,POST,
		GET:   请求参数是放在url后面的
		POST:  请求参数是放在请求体里的
	参数2  表示要请求的url路径
	参数3  是否是异步请求:
		true   异步请求;
		false  同步请求;


04. 解析json字符串
	1. eval解析
		eval解析: 最外层为数组，不错任何处理
		eval解析：最外层是对象，则在最外面包裹一个小括号
	2. JSON.parse()解析
		JSON.parse(): 最外层为数组，不错任何处理 
		JSON.parse(): 最外层是对象，也不需要任何处理
			
			

05. 设置请求头！
	请求头一般是放一些私密的信息给服务器，token,sign,或者信息的id等等
	xhr.setRequestHeader("token","123");
	xhr.setRequestHeader("userid","CooliY");

// 创建xhr
function createXHR(){
	if(window.XMLHttpRequest){
		return new XMLHttpRequest();
	}
	return new ActiveXObject("Microsoft.XMLHTTP");
}

function getXhr(){
	var xhr = createXHR();
	xhr.open("GET", "../virtualServer/todolist.json", true);
	
	// 请求头：存放私密信息，token, sign, id等
	xhr.setRequestHeader("token","123token");
	xhr.setRequestHeader("userid","132ID");
	
	xhr.send(null);
	// 添加监听事件
	xhr.onreadystatechange = function(){
		if(xhr.status==200 && xhr.readyState == 4){
			console.log(xhr)
			console.log(xhr.responseText)
			var resObj = JSON.parse(xhr.responseText);
			console.log(resObj)
			
		}else{
			console.log("xhr.status="+ xhr.status +",xhr.readyState="+ xhr.readyState);
		}
	}
};
getXhr();