前后端交互

约卡

于 2022-03-02 10:23:14 发布

阅读量161

点赞数

分类专栏：前端文章标签： javascript 前端 ajax

本文链接：https://blog.youkuaiyun.com/weixin_46247854/article/details/123198428

版权

前端专栏收录该内容

14 篇文章

订阅专栏

本文详细介绍了前后端交互中的一种常见方式——Ajax，特别是如何进行第一次Ajax请求。通过创建XMLHttpRequest对象，配置请求信息，设置请求完成后的回调函数，以及发送请求，实现与后台的数据通信。示例代码展示了GET请求的实现过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述
后端会给与一个接口文档

前后端如何交互
若干种前后端交互方式之一 Ajax

第一次ajax请求

<script>
			/*
			 * 第一次尝试ajax
			 */
			
			//1.创建一个ajax对象
			var xhr = new XMLHttpRequest()
			//2.配置本次的请求信息
			//请求方式: 按照接口文档来进行书写
			//请求地址:按照接口文档来进行书写
			//是否异步:默认是true  表示异步请求，选填为false,表示同步请求
			xhr.open('GET','http://localhost:8888/test/first',true)//大小写均可
		//3.配置一个请求完成后触发的事件
		//请求完整:本次请求发送出去，服务器接收到了我们的请求，并且服务器返回的信息已经返回到了浏览器
		xhr.onload =function(){
			//如何拿到后端返回的信息
			//语法:xhr.responseText
			console.log('xhr.responseText')
		}
		//4. 把本次请求发送出去
		xhr.send()
		</script>