Ajax前后端通信代码

本文详述了利用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
  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值