axios学习--起步

2020-05-07 16:07:53来源:博客园 阅读 ()

新老客户大回馈,云服务器低至5折

axios学习--起步

官网:http://www.axios-js.com/zh-cn/docs/

什么是 axios?

Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。

特性

  • 从浏览器中创建 XMLHttpRequests
  • 从 node.js 创建 http 请求
  • 支持 Promise API
  • 拦截请求和响应
  • 转换请求数据和响应数据
  • 取消请求
  • 自动转换 JSON 数据
  • 客户端支持防御 XSRF

安装

  使用 npm:

$ npm install axios

  使用 cdn:

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

 

 

demo:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
        <p id="p"></p>
    <script>
//get axios.get("/test") .then(function (value) { alert(value.data); });
//post axios.post(
"/pp") .then(function (value) { document.getElementById("p").innerText=JSON.stringify(value.data); }) .catch(function (reason) { alert(reason.data); });
 //axios API
      axios({
       method:'post',
       url:'/pp',
       data:{
     p1:"ass"
     }
    }).then(function (value) {
     alert(value.data+"--");
    })
</script> </body> </html>

Controller:

@Controller
public class TestController {

    @RequestMapping(value = "/t")
    public String test1(){
        return "a";
    }
    @GetMapping(value = "/test")
    @ResponseBody
    public String test2(){
        return "asdasdsad";
    }
    @PostMapping(value = "/pp")
    @ResponseBody
    public String pp(){
        return "pp";
    }
}

访问:http://localhost:8080/t

 

 


原文链接:https://www.cnblogs.com/crazy-lc/p/12845655.html
如有疑问请与原作者联系

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:模块(类)之间解耦利器:EventPublishSubscribeUtils 事件发布

下一篇:【漫画】JAVA并发编程三大Bug源头(可见性、原子性、有序性)