Axios

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

Get

  • ​​axios-demo.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>
  • ​​AxiosServlet​​
package com.ruochen.web.servlet;

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 入门教程_ios

Post

  • ​​axios.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>
  • ​​AxiosServlet​​ 不用修改

别名方式

Get

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

Post

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