Ajax前后端通信代码

最新推荐文章于 2024-09-06 17:49:15 发布

ZSs_Ss

最新推荐文章于 2024-09-06 17:49:15 发布

阅读量1.1k

点赞数 1

分类专栏：不知道该取什么名字文章标签： ajax java

本文链接：https://blog.csdn.net/zss_ss/article/details/110005366

版权

本文详述了利用Ajax进行前后端通信的代码实现，包括发送空对象、Json字符串的前端和后端处理，以及服务器端返回的字符串和Json格式数据。重点在于Ajax的参数设置与后端接收方式。

摘要由CSDN通过智能技术生成

0、写在前面

因为本人能力不高，可能有许多方面没有提及或遗漏，如果你对我的文章内容有一些想法和建议，请在评论中写出，十分感谢

1、目的

本文主要记录利用Ajax技术，如何进行前后端的通信。
方便日后编写这方面的代码时，可以拿来并且进行简单修改即可使用，所以本文主要涉及的是代码方面的，不注重原理方面的讲解。

2、所需Maven依赖

<dependency>
  <groupId>com.fasterxml.jackson.core</groupId>
  <artifactId>jackson-core</artifactId>
  <version>2.9.8</version>
</dependency>
<dependency>
  <groupId>com.fasterxml.jackson.core</groupId>
  <artifactId>jackson-databind</artifactId>
  <version>2.9.8</version>
</dependency>
<dependency>
  <groupId>com.google.code.gson</groupId>
  <artifactId>gson</artifactId>
  <version>2.8.5</version>
</dependency>

3、明确ajax编写格式

3.1 常用参数

因为考虑到实际应用，仅仅考虑常用的几个参数

url：			请求的url路径。受base标签的影响
type：			请求的类型。get、post ...
data：			发送给后端的数据。
contentType：	发送给后端的数据的格式。
dataType：		期望后端返回的数据的格式。
success：		请求响应成功后调用的方法
error：			请求响应失败后调用的方法

3.2 常用格式

xxx：表示待定数据

$.ajax({
   
    url:"xxx",
    type:"post",
    data:xxx,
    contentType:"xxx",
    dataType:"xxx",
    success:function (response) {
   
    	// 进行相应操作
        console.log("success");
        console.log(response);
    },
    error: function (XMLHttpResponse, textStatus, errorThrown) {
   
    	// 进行相应操作
        console.log("1 异步调用返回失败,XMLHttpResponse.readyState:"+XMLHttpResponse.readyState);
        console.log("2 异步调用返回失败,XMLHttpResponse.status:"+XMLHttpResponse.status);
        console.log("3 异步调用返回失败,textStatus:"+textStatus