精华内容
下载资源
问答
  • 细谈 axios和ajax区别

    万次阅读 多人点赞 2019-03-11 18:00:53
    和ajax有什么关系呢和区别呢?接下来一起看下: 1.区别 axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。 简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。...

    刚刚接触axios有好多疑惑。它和ajax有什么关系呢和区别呢?接下来一起看下:
    1.区别
    axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。
    简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。
    axios是ajax ajax不止axios。
    下面列出代码来对比一下:
    axios:

    
    axios({
                url: '/getUsers',
                method: 'get',
                responseType: 'json', // 默认的
                data: {
                    //'a': 1,
                    //'b': 2,
                }
            }).then(function (response) {
                console.log(response);
                console.log(response.data);
            }).catch(function (error) {
                console.log(error);
                })
    

    ajax:

    $.ajax({
                url: '/getUsers',
                type: 'get',
                dataType: 'json',
                data: {
                    //'a': 1,
                    //'b': 2,
                },
                success: function (response) {
                    console.log(response);
                }
            })
    

    2.优缺点:
    ajax:
    本身是针对MVC的编程,不符合现在前端MVVM的浪潮
    基于原生的XHR开发,XHR本身的架构不清晰,已经有了fetch的替代方案
    JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务
    axios:
    从 node.js 创建 http 请求
    支持 Promise API
    客户端支持防止CSRF
    提供了一些并发请求的接口(重要,方便了很多的操作)

    展开全文
  • axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。 简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。 代码来对比一下: axios代码: axios({ url: '/getUsers', ...

    1.区别
    axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。
    简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。

    代码来对比一下:
    axios代码:

    axios({
                url: '/getUsers',
                method: 'get',
                responseType: 'json', // 默认的
                data: {
                    //'a': 1,
                    //'b': 2,
                }
            }).then(function (response) {
                console.log(response);
                console.log(response.data);
            }).catch(function (error) {
                console.log(error);
                }

    ajax代码:

    $.ajax({
                url: '/getUsers',
                type: 'get',
                dataType: 'json',
                data: {
                    //'a': 1,
                    //'b': 2,
                },
                success: function (response) {
                    console.log(response)}
            })
    

    2.优缺点:
    ajax:
    1)本身是针对MVC编程,不符合前端MVVM的浪潮;
    2)基于原生XHR开发,XHR本身的架构不清晰,已经有了fetch的替代方案,jquery整个项目太大,单纯使用ajax却要引入整个jquery非常不合理(采取个性化打包方案又不能享受cdn服务);
    3)ajax不支持浏览器的back按钮;
    4)安全问题ajax暴露了与服务器交互的细节;
    5)对搜索引擎的支持比较弱;
    6)破坏程序的异常机制。

    axios:
    1)从 node.js 创建 http 请求;
    2)支持 Promise API;
    3)客户端支持防止CSRF;
    4)提供了一些并发请求的接口(重要,方便了很多的操作)。

    展开全文
  • axios和ajax区别

    千次阅读 2019-05-31 09:37:33
    1、axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。 简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。 axiosajax ajax不止axios。 2、优缺点 ajax: 本身是...

    1、axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。
    简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。
    axios是ajax ajax不止axios。
    2、优缺点

    ajax:

    本身是针对MVC的编程,不符合现在前端MVVM的浪潮
    基于原生的XHR开发,XHR本身的架构不清晰,已经有了fetch的替代方案
    JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务
    传统 Ajax 指的是 XMLHttpRequest(XHR), 最早出现的发送后端请求技术,隶属于原始js中,核心使用XMLHttpRequest对象,多个请求之间如果有先后关系的话,就会出现回调地狱。
    JQuery ajax 是对原生XHR的封装,除此以外还增添了对JSONP的支持。经过多年的更新维护,真的已经是非常的方便了,优点无需多言;如果是硬要举出几个缺点,那可能只有:
    1.本身是针对MVC的编程,不符合现在前端MVVM的浪潮
    2.基于原生的XHR开发,XHR本身的架构不清晰。
    3.JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理(采取个性化打包的方案又不能享受CDN服务)
    4.不符合关注分离(Separation of Concerns)的原则
    5.配置和调用方式非常混乱,而且基于事件的异步模型不友好。

    $.ajax({
       type: 'POST',
       url: url,
       data: data,
       dataType: dataType,
       success: function () {},
       error: function () {}
    });
    
    axios:

    从 node.js 创建 http 请求
    支持 Promise API
    客户端支持防止CSRF
    axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,本质上也是对原生XHR的封装,只不过它是Promise的实现版本,符合最新的ES规范,它本身具有以下特征:
    1.从浏览器中创建 XMLHttpRequest
    2.支持 Promise API
    3.客户端支持防止CSRF
    4.提供了一些并发请求的接口(重要,方便了很多的操作)
    5.从 node.js 创建 http 请求
    6.拦截请求和响应
    7.转换请求和响应数据
    8.取消请求
    9.自动转换JSON数据

    axios({
        method: 'post',
        url: '/user/12345',
        data: {
            firstName: 'Fred',
            lastName: 'Flintstone'
        }
    })
    .then(function (response) {
        console.log(response);
    })
    .catch(function (error) {
        console.log(error);
    });
    

    转载https://www.jianshu.com/p/8bc48f8fde75

    展开全文
  • 浅谈axios和ajax区别

    2020-11-13 11:02:21
    (1)axios是通过Promise实现对ajax技术的一种封装,就像jquery对ajax的封 装一样。(ajax技术实现了局部数据的刷新,axios实现了对ajax的封装。); (2)axiosajaxajax不止axiosaxios有的ajax都有,ajax有的...

    一、二者区别

    1.理论区别:

    (1)axios是通过Promise实现对ajax技术的一种封装,就像jquery对ajax的封 装一样。(ajax技术实现了局部数据的刷新,axios实现了对ajax的封装。);
    (2)axios是ajax,ajax不止axios;axios有的ajax都有,ajax有的axios不一 定有。

    2.代码区别:

    1.axios

    axios({
    	url: '/getName',
    	method: 'get',
    	responseType: 'json',  // 默认的
    	data: {
    		name:'tom'
    	}
    }).then(function (response) {
    	console.log(response);
    	console.log(response.data);
    }).catch(function (error) {
    	console.log(error);
    });
    
    

    2.ajax

    $.ajax({
         url: '/getName',
         type: 'get',
         dataType: 'json',
         data: {
              name:'tom'
             },
         success: function (response) {
            console.log(response)}
       })
    

    3.逻辑区别:

    1.ajax本身是针对MVC的编程:

    最典型的MVC就是jsp+servlet+javabean模式

    在这里插入图片描述

       JavaBean作为模型,既可以作为数据模型来封装业务数据,又可以作为业务逻辑模型来包含应用的业务操作。

       JSP作为表现层,负责提供页面为用户展示数据,提供相应的表单(Form)来用于用户的请求,并向控制器发出请求来请求模型进行更新。

       Serlvet作为控制器,用来接收用户提交的请求,然后获取请求中的数据,将之转换为业务模型需要的数据模型,然后调用业务模型相应的业务方法进行更新,同时根据业务执行结果来选择要返回的视图。

    2.axios符合现在前端MVVM的浪潮 :

    在这里插入图片描述
       ViewModel 层,它就像是一个中转站,负责转换 Model 中的数据对象,该层向上与视图层进行双向数据绑定,向下与 Model 层通过接口请求进行数据交互,起呈上启下作用。

       View 层展现的不是 Model 层的数据,而是 ViewModel 的数据,由 ViewModel 负责与 Model 层交互,这就完全解耦了 View 层和 Model 层。

    二、优缺点

    1.axios优点:

    (1)从浏览器中创建 XMLHttpRequest;
    (2)支持 Promise API;
    (3)从 node.js 创建 http 请求;
    (4)转换请求和响应数据;
    (5)自动转换JSON数据。

    1.ajax缺点:

    (1)基于原生的XHR开发,XHR本身的架构不清晰;
    (2)JQuery整个项目太大,单纯使用ajax却要引入整个JQuery非常的不合理;
    (3)不符合关注分离(Separation of Concerns)的原则;
    (4)配置和调用方式非常混乱,而且基于事件的异步模型不友好。

    三、总结:

        学习上:

        上个星期李老师正式发布课题任务之后就开始了静态页面的排版,至此已经完成了几个简单的静态页面和一下promise和以上axios的学习,下一步要进行接口的访问,数据的遍历以及静态页面的完善,这次需要些原生的js和一下表单,所以前提可能需要的时间多一些,但还是尽快完成比较好,为后面的阶段腾时间。下周要进行期末考试了,要认真复习,防止专业课成绩不理想。

        生活上:

        双11的时候买了一下厚的衣服,还没有到,最近因为新生,也一组没有闲着,他们也都挺努力, 希望他们能一直坚持下来。

    展开全文
  • (1)axios是通过Promise实现对ajax技术的一种封装,就像jquery对ajax的封 装一样。(ajax技术实现了局部数据的刷新,axios实现了对ajax的封装。); (2)axiosajaxajax不止axiosaxios有的ajax都有,ajax有的...
  • axios和ajax区别

    千次阅读 2019-06-13 11:00:28
    axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。 简单来说: ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。 axiosajax ajax不止axios。 下面列出代码来对比一下: ...
  • Axios和Ajax有什么区别

    万次阅读 2019-06-21 10:30:30
    Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器 node.js 中。 特点: 1.从浏览器中创建 XMLHttpRequests 2.从 node.js 创建 http 请求 3.支持 Promise API 4.拦截请求响应 5.转换请求数据响应数据 6....
  • AxiosAjax区别

    千次阅读 2019-09-02 13:13:44
    axios是一个基于 promise 的 HTTP 库,可以用在浏览器 node.js 中 特点: 从浏览器中创建 XMLHttpRequests 从 node.js 创建 http 请求 支持 Promise API 拦截请求响应 转换请求数据响应数据 取消请求 自动...
  • ajaxaxios区别ajax:核心使用XMLHttpRequest,对个请求之间如果有先后关系的话,就会出现回调地狱。 Jquery ajax是对原生XHR的封装,并添加了JSONP的支持。 缺点: 1.针对MVC的编程,不符合现在前端MVVM的...
  • axiosAjax,jQuery ajax,axios和fetch的区别

    万次阅读 多人点赞 2018-03-27 18:39:32
    提纲:Axios的概念安装Axios简单示例Axios的APIAxios的请求配置响应数据格式Axios的拦截器Ajax,jQuery ajax,axios和fetch的区别内容:Axios的概念 axios 是一个基于 promise 的 HTTP 库,可以用在浏览器 node....
  • axios和ajax区别? AJAX完整是 Asynchronous Javascript And XML ,异步jsxml,是一种异步请求的技术。(异步:在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页。) jQuery ajax - ajax()方法 w3...
  • axiosajax请求的区别

    千次阅读 2019-02-26 00:20:37
    一、axios axios({  url:'/user/xxx',  method:'POST',  responseType:'json',  data:{  a:a,  b:b  }  }).then( res => { }).catch( error =...
  • 区别axios是通过Promise实现对ajax技术的一种封装,就像jquery对ajax的封装一样,简单来说就是ajax技术实现了局部数据的刷新,axios实现了对ajax的封装,axios有的ajax都有,ajax有的axios不一定有,总结一句话...
  • 接触了axios之后,发现以前学习的ajax很类似,于是整理了它们之间的区别 1.区别 axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。 简单来说: ajax技术实现了网页的局部数据刷新,axios...
  • vue中axios和ajax区别是: axios是通过promise实现对ajax技术的一种封装,而ajax则是实现了网页的局部数据刷新。 axios可以说是ajax,而ajax不止是axios。 用法相同,但个别参数不同。 jQuery ajax $.ajax({ ...
  • ajax:  $.ajax({  url: '接口地址',  type: 'get', //或者post 请求类型  dataType: 'json',  data: { // 要发送的请求参数  'username' : '张三',  'password' : '123'  },  success : function...
  • axios是通过promise实现对ajax技术的一种封装,就像jQuery实现ajax封装一样。 ajax技术实现了网页的局部数据刷新,axios实现了对ajax的封装。 axiosajax ajax不止axios。 代码 axios({ url: '/getUsers', ...
  • 一.axiosajax区别 相同点:都是执行异步请求操作 不同点: 大小 axios体积小 只需在要使用的目录下npm install axios --save ajax 需要导入jQuery【体积较大 只是为了ajax去引入是不值得的】 针对方向 ...
  • promise axios ajax区别详解

    千次阅读 2020-10-11 14:04:44
    介绍axios和promise 一、axios的介绍 axios 是由 promise 封装的一个 http 的库。 promise是 es6 为解决异步编程的。 什么是异步?  1. 不会按照浏览器的加载方式 由上到下。 前端哪里面有异步?  1. 回调函数  ...
  • axios 是一个基于Promise 用于浏览器 nodejs 的 HTTP 客户端,本质上也是对原生XHR的封装,只不过它是Promise的实现版本,符合最新的ES规范,它本身具有以下特征: 1.从浏览器中创建 XMLHttpRequest 2.支持 ...
  • 文章目录使用axios发送请求使用fetch方法发送请求的一般操作: 使用axios发送请求 后端代码 node.js: //1. 引入express const { request, response } = require('express'); const express = require('express'); /...
  • 今天小编就为大家分享一篇vue 组件的封装之基于axiosajax请求方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 27,259
精华内容 10,903
关键字:

axios和ajax区别