前后端的数据交互

java 同时被 2 个专栏收录
35 篇文章 1 订阅
39 篇文章 4 订阅

Java学习——前后端数据交互(一)

当前的结果是提交之后js内有响应。不知道原因在哪个地方,下面是当前了解的一些知识。

 

1、在html页面要链接到js页面,要有个这样的东西(html页面

 

2、在js页面要定义controller层的url地址,就是requestMapping后面的内容(js页面)

3、分为获取数据和提交数据(js页面)

首先是获取数据,shopInfoUrl是定义的conroller层的url地址,data是转换为json格式的字符串,通过$.getJSON来获取

其次是提交数据,为提交提供一个响应

然后在获取页面的数据,并转换为JSON格式。通过new FormData(), formData.append('shop',shopImg),将数据封装到对象里面

最后是提交数据,通过$.ajax

 

4、调用定义的方法(js页面)

 

5、后台获取数据,通过Request.getParameter()来获取JSON格式的字符串。(Java Controller层)

 

6、将JSON格式的字符串,转为原来的格式,通过ObjectMapper类的readValue方法来讲JSON格式的字符串转为对象

 

总结一下:

Java前后端数据的交互,不仅是获取还是提交,需要转换为JSON格式的字符串。比如从前端传递到js需要转换为JSON格式,通过加上@ResponseBody的注解,返回类型为Map;从前端传递到后端,需要new FormData()。在进行传递。

Java学习——前后端数据交互(二)

以下是前端页面数据传递后Java后台。

前段时间在前行前后端数据交互的时候,点击提交没有响应。原因是因为下面这个地方出错了。js目录的指向不对。

这里最前面的一个表示该文件所属的文件夹的上一级目录的父目录。如果是两级的话则加两个..表示上两级的父目录。

接着又是一步步调试了,在每一个步骤下面使用alert()方法。使用这种方式在学习的初期,能有效地定位错误出现在哪个地方。

接着是Java后台数据的接收,接受需要将Json格式的数据转换为Java能够识别的数据。因此要用到ObjectMapper类的readValue()方法,具体使用如下图

获取之后需要做一些验证,打印在控制台上。第一列是将json格式的转换后的数据,第二个时json格式的数据。

 

总结:从前端页面传递数据到Java后端。需要Java后端的url,传递方式get/post。需要将json格式的数据转换为Java能够识别的数据。

Java学习——前后端数据交互(三)

以下是Java后端的数据传递到前端页面

1、在Java后端写上url地址,然后加上@ResponseBody注解,目的是为了将返回的数据转为json格式。

2、

(1)在js页面定义Java后台方法的url;

(2)调用方法。

方法内:注意通过     data.定义的对象名     的方式来获取Java端传递过来的对象

  • 17
    点赞
  • 0
    评论
  • 91
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 技术黑板 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值