Axios 入门教程

原创

ruochen

发布于 2022-03-07 11:23:39

1.5K00

代码可运行

运行总次数：0

代码可运行

Axios

引入 axios 的 js 文件 ```html <script src="js/axios-0.18.0.js"></script> ```
使用 axios 发送请求，并获取响应结果 ```js axios({ method: "get", url: "" }).then(function (resp){ alert(resp.data); }) ``` ```js axios({ method: "post", url: "", data: "" }).then(function (resp){ alert(resp.data); }) ```

axios-demo.html ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body>

        <script src="js/axios-0.18.0.js"></script>

        <script>

            // 1. get

            axios({

                method: "get",

                url: "http://localhost:8080/axios-demo/axiosServlet?username=zhagnsan"

            }).then(function (resp) {

                alert(resp.data);

})

        </script>

    </body>

</html>

```

import javax.servlet.*;

import javax.servlet.http.*;

import javax.servlet.annotation.*;

import java.io.IOException;

@WebServlet("/axiosServlet")

public class AxiosServlet extends HttpServlet {

    @Override

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        System.out.println("get...");

        // 1. 接收请求参数

        String username = request.getParameter("username");

        System.out.println(username);

        // 2. 响应数据

        response.getWriter().write("hello Axios~");

    @Override

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        System.out.println("post...");

        this.doGet(request, response);

```

axios.html ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body>

        <script src="js/axios-0.18.0.js"></script>

        <script>

            // 1. get

            /* axios({

                method: "get",

                url: "http://localhost:8080/axios-demo/axiosServlet?username=zhagnsan"

            }).then(function (resp) {

                alert(resp.data);

            }) */

            axios({

                method: "post",

                url: "http://localhost:8080/axios-demo/axiosServlet",

                data: "username=zhangsan"

            }).then(function (resp) {

                alert(resp.data);

})

        </script>

    </body>

</html>

```

axios.get("url").then(function (resp){
	alert(resp.data);
})

axios.post("url", "参数").then(function (resp){
	alert(resp.data);
})

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

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

原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。

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

登录后参与评论

0 条评论

热度