Axios 入门教程
【摘要】
AxiosGetPost别名方式GetPost
Axios
引入 axios 的 js 文件<script src="js/axios-0.18.0.js">&l...
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); } }
- 测试
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);
})
文章来源: ruochen.blog.csdn.net,作者:若尘,版权归原作者所有,如需转载,请联系作者。
原文链接:ruochen.blog.csdn.net/article/details/123169269
【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论(0)