前端发送请求的方法总结

1 )原生的ajax

get请求

function ajax(url,success,error){
if(window.XMLHttpRequest){
var oAjax = new XMLHttpRequest();
}else{
var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
}
oAjax.open('GET',url,true);
oAjax.send();
oAjax.onreadystatechange = function(){
if(oAjax.readyState==4){
if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){
success&&success(oAjax.responseText);    //成功的回调函数
}else{
error&&error(oAjax.status);              //失败的回调函
}
}
};
}

post请求

function ajax(url,success,error){
if(window.XMLHttpRequest){
var oAjax = new XMLHttpRequest();
}else{
var oAjax = new ActiveXObject('Microsoft.XMLHTTP');
}
oAjax.open('POST ',url,true);
oAjax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
oAjax.send('fname=Bill&lname=Gates');
oAjax.onreadystatechange = function(){
if(oAjax.readyState==4){
if(oAjax.status>=200&&oAjax.status<300||oAjax.status==304){
success&&success(oAjax.responseText);    //成功的回调函数
}else{
error&&error(oAjax.status);              //失败的回调函
}
}
};
}

jquery 发送ajax请求

$.ajax({
//请求方式
type : "POST",
//请求的媒体类型
contentType: "application/json;charset=UTF-8",
//请求头
headers：{
}，
//请求地址
url : "http://127.0.0.1/admin/list/",
//数据，json字符串
data : JSON.stringify(list),
//请求成功
success : function(result) {
console.log(result);
},
//请求失败，包含具体的错误信息
error : function(e){
console.log(e.status);
console.log(e.responseText);
}
});

vue axios

axios是基于promise可以用于浏览器和node.js的http客户端

支持浏览器和node.js
支持promise
能拦截请求和响应
能转换请求和响应数据
能取消请求
自动转换JSON数据
浏览器端支持防止CSRF(跨站请求伪造)

// 发起一个POST请求
axios({
method: ‘post’,
url: ‘/user/12345’,
data: {
firstName: ‘Fred’,
lastName: ‘Flintstone’
}
}).then(data=>{console.log(data)});

具体用法[添加链接描述](https://www.kancloud.cn/yunye/axios/234845)