前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >axios,ajax,fetch请求示范

axios,ajax,fetch请求示范

作者头像
biaoblog.cn 个人博客
发布2022-08-11 19:59:38
3910
发布2022-08-11 19:59:38
举报

fetch:

代码语言:javascript
复制
      fetch("xxx", {
                method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        body: JSON.stringify({
          name: "Hubot",
          login: "hubot",
        }),
      });

axios:

执行 GET 请求

代码语言:javascript
复制
// 为给定 ID 的 user 创建请求
axios.get('/user?ID=12345')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

// 上面的请求也可以这样做
axios.get('/user', {
    params: {
      ID: 12345
    }
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

执行 POST 请求

代码语言:javascript
复制
axios.post('/user', {
    firstName: 'Fred',
    lastName: 'Flintstone'
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

执行多个并发请求

代码语言:javascript
复制
function getUserAccount() {
  return axios.get('/user/12345');
}

function getUserPermissions() {
  return axios.get('/user/12345/permissions');
}

axios.all([getUserAccount(), getUserPermissions()])
  .then(axios.spread(function (acct, perms) {
    // 两个请求现在都执行完成
  }));

ajax:

代码语言:javascript
复制
$("#ajaxBtn").click(function(){
 $.ajax({
    url:"http://localhost:8080/16_json_ajax_i18n/ajaxServlet",
      headers:{"appId":appId,"appKey":appKey,"Content-Type":"text/plain;charset=UTF,
    data:{action:"jQueryAjax"},
    type:"GET",
    success:function (data) {
    // alert("服务器返回的数据是:" + data);
    // var jsonObj = JSON.parse(data);
     $("#msg").html("编号:" + data.id + " , 姓名:" + data.name);
    },
    dataType : "json"
   });
  });
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • fetch:
  • axios:
  • ajax:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档