首页 > 其他分享 >Axios异步框架

Axios异步框架

时间:2023-04-11 23:36:37浏览次数:37  
标签:username 异步 Axios 框架 get function resp axios data

Axios快速入门

1.引入axios的js文件

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

2.使用axio发送请求,并响应结果

get:

  axios({
method:"get",
url:"http://localhost:8080/science/axiosServlet?username=zhangsan"
}).then(function (resp)
{
alert(resp.data);
})

post:

axios({
method:"post",
url:"http://localhost:8080/science/axiosServlet",
data:"username=zhangsan"
}).then(function (resp)
{
alert(resp.data);
})
简化:
1.get
axios.get("http://localhost:8080/science/axiosServlet?username=zhangsan").then(function (resp)
{
alert(resp.data);
})
2.axios.post("http://localhost:8080/science/axiosServlet","username=zhangsan").then(function (resp)
{
alert(resp.data);
})

完整代码:

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/science/axiosServlet?username=zhangsan"
// }).then(function (resp)
// {
// alert(resp.data);
// })
// 1.post
// axios({
// method:"post",
// url:"http://localhost:8080/science/axiosServlet",
// data:"username=zhangsan"
// }).then(function (resp)
// {
// alert(resp.data);
// })
// 1.get
// axios.get("http://localhost:8080/science/axiosServlet?username=zhangsan").then(function (resp)
// {
// alert(resp.data);
// })
axios.post("http://localhost:8080/science/axiosServlet","username=zhangsan").then(function (resp)
{
alert(resp.data);
})
</script>
</body>
</html>
AxiosServlet
public class AxiosServlet extends HttpServlet {
private Service service = new Service();

@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// request.setCharacterEncoding("UTF-8");
// String username=request.getParameter("username");
// String password=request.getParameter("password");
System.out.println("get....");
//1.接收参数
String username = request.getParameter("username");
System.out.println(username);
//2 响应数据
response.getWriter().write("hello AxiosServlet~");
//
}

@Override
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
System.out.println("post....");
this.doGet(request, response);
}
}
结果演示:

总结:
Axios 是一个基于 promise 的 HTTP 库,简单的讲就是可以发送get、post请求。


 

标签:username,异步,Axios,框架,get,function,resp,axios,data
From: https://www.cnblogs.com/JIANGzihao0222/p/17308265.html

相关文章

  • 网络框架重构之路plain2.0(c++23 without module) 综述
    最近互联网行业一片哀叹,这是受到三年影响的后遗症,许多的公司也未能挺过寒冬,一些外资也开始撤出市场,因此许多的IT从业人员加入失业的行列,而且由于公司较少导致许多人求职进度缓慢,很不幸本人也是其中之一。自从参加工作以来,一直都是忙忙碌碌,开始总认为工作只是为了更好的生活,但是一......
  • flask框架06 sqlalchemy使用 scoped_session线程安全 一对多 多对多 增删改查
    今日内容详细目录今日内容详细1sqlalchemy快速插入数据2scoped_session线程安全2.1基本使用2.2加在类上的装饰器3基本增删查改3.1基本增删查改和高级查询3.2原生sql3.3django中执行原生sql4一对多4.1表模型4.2新增和基于对象的查询5多对多5.1表模型5.2增加和基于......
  • php的TP框架保存数据报错: SQLSTATE[HY000]: General error: 1366 Incorrect string v
    这一般情况就是保存表情字符导致的字符长度问题原因可能: (需要改字符集为 utf8mb4 排序规则为utf8mb4_general_ci)1.数据表字段不是utf8mb42.项目目录下文件.env里配置mysql  CHARSET=utf8需要该为 CHARSET=utf8mb43.如果不存在.env文件,则可能是config目......
  • Axios是什么?Axios的名字的由来?
    axios是什么?他的名字的由来?Axios是一个基于Promise的HTTP客户端,可以用于浏览器和Node.js环境。它有助于发出XMLHttpRequests(发出HTTP请求),可以处理跨域请求。 Axios的名字来源于希腊神话中的英雄Axios,他是一个勇敢的冒险家,有着强大的力量和知识,他可以改变任何事物,使它们更加强大......
  • 记录UMI框架下文件预览的问题
    1.要想文件预览需要用到file-loader配置 方法:在config文件夹下的config.js文件中添加代码//UMI框架下使用的webpack配置chainWebpack(config){config.module.rule().test(/\.(pdf|svg|docx|doc)$/)//正则校验文件后缀名.use('file-loader?nam......
  • 【云享专刊】开源遇上华为云,OCP架构变身“云原生框架”
    摘要:华为云DTSE团队出品云原生改造指南,助力轻松实践OCP上云。本文分享自华为云社区《【云享专刊】开源遇上华为云,OCP架构变身“云原生框架”》,作者:华为云社区精选。OpenStack、Docker、K8S、Hadoop……这些都是开发者耳熟能详的开源技术。开源技术的应用,正不断推动新兴技术和产业......
  • go语言学习-gin框架路由
    表单参数表单参数传输为post请求,http常见的传输格式为四种application/jsonapplication/x-www-form-urlencodedapplication/xmlmultipart/form-data表单参数可以通过PostForm()方法获取,该方法默认解析的是x-www-form-urlencoded或from-data格式的参数<!DOCTYPEhtml><htmllang="e......
  • 【云享专刊】开源遇上华为云,OCP架构变身“云原生框架”
    摘要:华为云DTSE团队出品云原生改造指南,助力轻松实践OCP上云。本文分享自华为云社区《【云享专刊】开源遇上华为云,OCP架构变身“云原生框架”》,作者:华为云社区精选。OpenStack、Docker、K8S、Hadoop……这些都是开发者耳熟能详的开源技术。开源技术的应用,正不断推动新兴技术和......
  • Python 爬虫框架 looter
    我们常用的pyspider,scrapy就不多介绍了,今天咱们玩looter框架的爬虫,其实爬虫很有意思,看看下面的代码就秒懂。安装先安装好python3,需要3.6以上,然后执行pipinstalllooterλlooter-hLooter,apythonpackagedesignedforwebcrawlerlovers:)Author:alphardexQQ:258......
  • 高性能 Jsonpath 框架,Snack3 3.2.65 发布
    高性能Jsonpath框架,Snack33.2.65发布来源:投稿作者: 梅子酒好吃2023-04-1014:18:00 0Snack3,一个高性能的JsonPath框架借鉴了Javascript所有变量由var申明,及Xmldom一切都是Node的设计。其下一切数据都以ONode表示,ONode也即Onenode之意,代......