ajax中get请求和post请求的写法和使用区别简述

Ajax中get和post 的写法：

1.ajax中的get请求写法（js原生）

//1.创建XMLHttpRequest对象
let xhr = new XMLHttpRequest();
//2.设置请求参数（"传输的方式","文件的地址","是否异步"）
xhr.open("get","ajax_get.php?username"+发送的数据,true);
//3.设置回调函数
xhr.onreadystatechange = function(){
	//判断数据是否交互成功
	if(xhr.status == 200 && xhr.readyState == 4){
		//5.接收后端返回的数据
		console.log(xhr.responseText);
	}
}
//4.发送请求
xhr.send();

2.ajax中的post请求写法（js原生）

//1.创建XMLHttpRequest对象
let xhr = new XMLHttpRequest();
//2.设置请求参数（"传输的方式","文件的地址","是否异步"）
xhr.open("post", "ajax_Post.php", true);
//3.必须设置请求头 
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//4.设置回调函数
xhr.onreadystatechange = function() {
	//判断数据是否交互成功
	if (xhr.status == 200 && xhr.readyState == 4) {
		//6.接收后端返回的数据
		console.log(xhr.responseText);
	}
}
//5.发送请求
xhr.send("username"+发送的数据);

从以上两种请求写法中我们可以看出一部分区别在哪里，如下：

区别1：

• get请求发送的数据跟在请求参数中文件地址的后面，参数会在URL中显示
  xhr.open("get","ajax_get.php?username"+前端发送的数据,true);

• post请求发送的数据写在发送的请求中，而使用Post请求,URL则不会显示出参数；
  xhr.send("username"+前端发送的数据);

区别2：

• get请求不需要设置请求头，而post请求必须设置请求头
  xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

区别3：

• post传输的数据量大，可以达到2M，而get方法由于受到URL长度的限制,只能传递1024字节

区别4：

• get方式请求的数据会被浏览器缓存起来,缓存的账号密码等会造成安全问题，post相对来说可以避免这个问题，但也不是绝对安全。

注意： 当前端发送多个数据时用 & 组装
user_name="+ userName +"&user_age="+ userAge

欢迎大家参考，有不足之处欢迎讨论指正！