1.两种方法请求接口代码
axios
axios({ url: ‘接口地址‘, method: ‘get/post‘, responseType: ‘json‘, // 默认格式 data: { "参数名" : "参数值"
} }).then(function (response) { console.log(response); }).catch(function (error) { console.log(error); })
ajax
$.ajax({ url: ‘接口地址‘, type: ‘get/post‘, dataType: ‘json‘, data: {
"参数名" : "参数值"
},
success: function (response) {
console.log(response);
}
})
两者基本使用相似,axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。
简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。
2.优缺点
ajax:
1、本身是针对MVC编程,不符合前端MVVM的浪潮。
2、基于原生XHR开发,XHR本身的架构不清晰,已经有了fetch的替代方案,jquery整个项目太大,单纯使用ajax却要引入整个jquery非常不合理(采取个性化打包方案又不能享受cdn服务)
3、ajax不支持浏览器的back按钮。
4、安全问题ajax暴露了与服务器交互的细节。
5、对搜索引擎的支持比较弱。
6、破坏程序的异常机制。
7、配置和调用方式非常混乱,而且基于事件的异步模型不友好。
1.本身是针对MVC的编程,不符合现在前端MVVM的浪潮
2.基于原生的XHR开发,XHR本身的架构不清晰。
3.JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务)
4.不符合关注分离(Separation of Concerns)的原则
axios:
1.从浏览器中创建 XMLHttpRequest
2.支持 Promise API
3.客户端支持防止CSRF
4.提供了一些并发请求的接口(重要,方便了很多的操作)
5.从 node.js 创建 http 请求
6.拦截请求和响应
7.转换请求和响应数据
8.取消请求
9.自动转换JSON数据