异步请求（多种方式）

最新推荐文章于 2024-03-13 22:22:45 发布
最新推荐文章于 2024-03-13 22:22:45 发布
阅读量1.9k 收藏
点赞数
分类专栏： JavaEE 文章标签： java javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_42223701/article/details/121271683
版权

之前每次请求都会重新请求所有资源。但是很多时候仅仅需要页面的局部数据刷新即可。此时需要发送异步请求来实现这种局部数据刷新的要求。使用JSON数据传输格式。

取得一个雇员信息
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page isELIgnored="false"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>My JSP 'demo.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<script type="text/javascript" src="js/jQuery.js"></script>
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript">
		$(function(){
			$("a").click(function(){
				$.get("emp/getOne",{"id":7654},function(data){
					alert(data);
				})
			})
		})
	</script>

  </head>
 
  <body>
	<a href="javascript:void(0)">取得一个雇员信息</a>
  </body>
</html>

String pathInfo = req.getPathInfo();
		req.setCharacterEncoding("utf-8");
		resp.setContentType("text/html;charset=utf-8");
		try {
			if("/login".equals(pathInfo)){
				this.login(req, resp);
			}else if ("/regist".equals(pathInfo)) {
				this.regist(req, resp);
			}else if ("/remove".equals(pathInfo)) {
				this.removeById(req, resp);
			}else if ("/getOne".equals(pathInfo)) {
				this.getEmpById(req,resp);
			}else if ("/list".equals(pathInfo)) {
				this.getEmpList(req,resp);
			}
			
		} catch (Exception e) {
			e.printStackTrace();
		}
取得多个信息
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@page isELIgnored="false"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    <title>My JSP 'demo.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<script type="text/javascript" src="js/jQuery.js"></script>
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript">
		$(function(){
			$("a:eq(0)").click(function(){
				$.get("emp/getOne",{"id":7654},function(data){
					alert(data);
				})
			})
			$("a:eq(1)").click(function(){
				$.get("emp/list",{"kw":"","cp":1,"ls":10},function(data){
					alert(data);
				})
			})

		})
	</script>

  </head>
 
  <body>
	<a href="javascript:void(0)">取得一个雇员信息</a>
	<a href="javascript:void(0)">取得多个雇员信息</a>
  </body>
</html>
其他方式
$(function(){
			$("a:eq(0)").click(function(){
				$.get("emp/getOne",{"id":7654},function(data){
					alert(data.empno);
				},"json")
			})

$(function(){
			$("a:eq(0)").click(function(){
				$.getJSON("emp/getOne",{"id":7654},function(data){
					alert(data.empno);
				})
			})

$("a:eq(1)").click(function(){
				$.post("emp/list",{"kw":"","cp":1,"ls":10},function(data){
					alert(data);
				})
			})
ajax异步请求
			$("a:eq(1)").click(function(){
				$.ajax({
					type:"post",
					url:"emp/list",
					data:"cp=1&ls=10&kw=A",
					dataType:"JSON",
					success:function(data){
						alert(data)
					}
				})
			})
设置同步

async:false,
锁定浏览器，只有请求处理完毕之后才能执行后面的代码

$(function(){
			var emp;
			$("a:eq(0)").click(function(){
				$.ajax({
					type:"post",
					url:"emp/getOne",
					data:"id=7654",
					dataType:"JSON",
					async:false,
					success:function(data){
						emp=data;
						alert(emp.ename);
					}
				})
				alert(emp.empno);
			})
Dragon.liu
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
异步HttpClient
04-21
HttpClient 支持同步和异步两种方式，也支持多种不同实现。目前有Netty 和 Apache Compoenet两种实现。本次上传移除了Netty实现。主要解决生产环境中同步httpclient造成的IO阻塞问题。同步http请求将导致 tomcat 的...
基于android-async-http的一个http异步请求库.zip
最新发布
05-11
多种设备支持：Android操作系统可以运行在多种不同类型的设备上，包括手机、平板电脑、智能电视、汽车导航系统等。 此外，Android系统还有一些常见的问题，如应用崩溃、电池耗电过快、Wi-Fi连接问题、存储空间不足、...
四种常见的异步请求方式
weixin_52236586的博客
03-05 2637
四种常见的异步请求方式
异步请求的方法
H先生
04-29 8175
1. AJAX AJAX ( Asynchronous JavaScript and XML ) 异步的 JS 和 XML，通过 AJAX 可以在浏览器中向服务器发送异步请求，核心是XMLHttpRequest。 无需刷新页面获取数据 根据用户事件来更新页面部分内容 1.1. XMLHttpRequest 中基本的方法有 abort() : 停止发送当前请求 getAllResponseHeaders() : 获取服务器返回的全部响应头 getRequestHeader(“headerLabel”)：
异步请求是什么，基于什么原理
子玉的博客
03-13 444
异步请求的使用可以提高页面的响应速度，避免阻塞主线程，以及处理大量的 I/O 操作，使程序具有更好的性能和用户体验。3. **Async/Await**：使用 async 函数和 await 关键字来编写异步代码，使其看起来像同步代码一样，提高代码的可读性和维护性。2. **Promise**：使用 Promise 对象来处理异步操作，通过 `then()` 方法链式调用处理成功和失败的情况。1. **回调函数**：通过传递回调函数作为参数，在异步操作完成后调用回调函数来处理结果。
实现异步请求有哪些方式
wyzqhhhh的博客
04-23 1283
​ axios支持各种请求类型，如GET、POST、PUT等，并支持并发请求、请求取消、请求拦截、响应拦截、错误处理等功能。axios也提供了丰富的配置选项，例如请求超时时间、请求头、响应类型等。它可以同时处理浏览器中的XHR请求和Node.js中的http请求，并且具有很好的API设计。​ React、Vue等现代JavaScript框架中也经常使用axios来进行HTTP请求，如果您使用这些框架，建议使用npm安装axios并通过模块化方式引入。// 设置请求方式和请求地址。// 创建一个XHR对象。
异步请求与同步请求
发子鸡的博客
06-28 966
基本概述 当浏览器向服务器发送同步请求时，服务处理同步请求的过程中，浏览器会处于等待的状态，服务器处理完请求把数据响应给浏览器并覆盖浏览器内存中原有的数据，浏览器重新加载页面并展示服务器响应的数据。 那么，有没有一种技术，可以让浏览器发送请求给服务器，服务器处理请求的过程中，浏览器不处于等待的状态，并且浏览器接收响应数据的同时不再重新加载整个页面，既请求发送之前的数据不丢失，又能实现页面的局部刷新呢？那就要用到ajax请求——异步请求模型，那么异步请求的原理是什么呢？ 我们知道，在同步请求模型中，浏览器是直
异步请求(Ajax,axios,json)
m0_73503454的博客
07-06 1592
异步请求(Ajax,axios,json)
flask-redis-docker:对dockerized Flask应用程序的异步请求示例
05-09
flask-redis-docker 有关如何在能够执行异步请求的Docker中部署Flask应用程序的示例。这个怎么运作尽管Python通过多种技术允许异步执行，但从Docker中的主进程派生异步进程并非易事（请参阅 ）。 唯一的方法是在容器...
Jquery zTree 树控件异步加载操作
01-19
支持一次性静态生成 和 Ajax 异步加载 两种方式 支持多种事件响应及反馈 支持 Tree 的节点移动、编辑、删除 支持任意更换皮肤 / 个性化图标（依靠css） 支持极其灵活的 checkbox 或 radio 选择功能 简单的参数...
如何快速解决JS或Jquery ajax异步跨域的问题
11-27
一种是jsonp方式：即在前端发送异步请求时，添加相关的jsonp设置或配置；后端则返回可供jsonp解析的格式的串。  但是jsonp方式只支持get的请求方式，并且不被新浏览器版本的支持（新浏览器版本多进行OPITION请求–...
异步请求-AJAX
listeningdu的博客
11-27 3081
AJAX 即“Asynchronous Javascript And XML”（异步 JavaScript和 XML），是指一种创建交互式、快速动态网页应用的网页开发技术，无需重新加载整个网页的情况下，能够更新部分网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。AJAX关键技术使用CSS构建用户界面样式,负责页面排版和美工使用DOM进行动态显示和交互,对页面进行局部修改。
【SpringBoot WEB系列】异步请求知识点与使用姿势小结
小灰灰blog的专栏
03-31 832
【SpringBoot WEB系列】异步请求知识点与使用姿势小结 在 Servlet3.0 就引入了异步请求的支持，但是在实际的业务开发中，可能用过这个特性的童鞋并不多？ 本篇博文作为异步请求的扫盲和使用教程，将包含以下知识点 什么是异步请求，有什么特点，适用场景 四种使用姿势： AsyncContext 方式 Callable WebAsyncTask DeferredResult ...
异步请求实现
congchp的博客
01-21 1910
什么是异步请求 redis/mysql提供的客户端，hiredis/mysqlclient都是同步的。request发出后，就在等着response。 mysql_query(sql), 一个请求发出后，当前线程挂起等待，当mysql server返回结果后，函数才返回。这就是一个同步的请求过程。 异步请求，就是请求发出后，不需要等待结果，函数直接返回，当server返回结果后，调用回调函数进行处理。 如何做一个异步请求？ 发送请求，是一个连接还是多个连接？ 指的是一个请求没有返回，再发起一个请求，是.
同步请求和异步请求
qq_53453519的博客
03-20 2317
同步请求和异步请求是两种不同的网络请求方式。同步请求（Synchronous Request）是指在请求发起后，客户端会一直等待服务器返回响应结果后才继续执行后续代码。在这个过程中，如果网络环境较差或服务器响应时间较长，客户端的执行就会被阻塞，导致用户体验不佳。异步请求（Asynchronous Request）则是指在请求发起后，客户端可以继续执行后续代码，而不必等待服务器响应。总之，异步请求适用于需要快速响应并且需要频繁进行请求的场景，而同步请求则适用于一些需要等待服务器返回结果后才能继续执行的场景。
什么是同步请求和异步请求？
热门推荐
ZZULI_星.夜
07-20 2万+
一、同步、异步请求 浏览器发送请求给服务器，其有同步请求和异步请求两种方式。 1同步请求 什么叫同步请求呢？ 就是在发送一个请求之后，需要等待服务器响应返回，才能够发送下一个请求。 之前学的请求是通过浏览器地址栏发送请求，这种方式就是属于同步请求。 但是其有两个缺陷： ①请求必须要等待响应 如果遇到请求阻塞，网络延迟，用户需要等待，这样用户体验效果不好。 ②请求时会携带所有的信息 比如说一个form表单，需要填入用户名，密码，手机号，等多个信息。 如果其中有一个信息填写错了，请求失败，又要全部重新填写，会很
【异步请求】异步操作ajax、axios
weixin_52479803的博客
02-06 272
AJAX
几种异步函数的请求方式 | generater、async、promise
qq_46472106的博客
09-21 583
文章目录generater函数async函数promise函数 generater函数 一、特点 1.generator不是函数（yield只能写在generater中） g()不会立即执行，而是一上来就暂停，并返回一个Iterator对象（返回值为iterator，g1是iterator） 每次g1.next()都会打破暂停状态去执行，直到遇到下一个yield或者return 遇到yield时，会执行yeild后面的表达式，并返回执行之后的值，然后再次进入暂停状态，此时done: fals
redux-toolkit 异步请求 多种方法
06-10
Redux Toolkit 提供了多种处理异步请求的方法，除了上面提到的 `createAsyncThunk`，还有以下几种方法： 1. `createAsyncThunk` + `createSlice` 这种方法和之前提到的相同，使用 `createAsyncThunk` 函数创建一个...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值