Question

ant-design怎么配合java后台进行数据交互

Answer 1

有两种方法：

其一:

使用ajax，比如jQuery的ajax (不推荐)

npm install jQuery 之后，跟之前直接使用jQuery ajax的方法一样用即可.

其二：

使用fetch：

关于fetch的概念及解释，可自行查阅相关资料，在我这边的使用中，使用的是dva框架(see:dvajs/dva-knowledgemap), 简略来说是蚂蚁金服的前端同学为方便大家使用，基于redux + react-router + redux-saga 等进行一层轻量封装(see: dva 介绍 · Issue #1 · dvajs/dva)，dva中封装了一个request.js，用于做异步请求，这里的底层即是fetch，代码见：(https://github.com/dvajs/dva-example-user-dashboard/blob/master/src/utils/request.js)

在使用过程中，注意一个问题，即fetch 默认的Content-type是text/plain;charset=UTF-8，与jQuery 默认的 ‘'application/x-www-form-urlencoded;charset=UTF-8'不一致。而常用的java web框架如Spring MVC默认识别的是表单类型，即jQuery的这种格式。

因此，有两种方法：

方法1

更改请求的Content-type：

首先，前台将 Json对象序列化为键值对“key1=xx&key2=xx”这种，比如dva中使用的 qs.stringify(params)；然后再fetch请求时，加上如下参数：

追答

options.credentials = 'include';
if (options.method === 'post') {
const headers = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
};
options.headers = {...headers, ...options.headers};
然后再调用fetch：

return fetch(url, options).......
方法2

后台指定识别json，fetch 的'Content-Type'设置为 'application/json', 数据使用JSON.stringify()序列化后传到后台，后台比如Spring MVC来说，在参数前加一个注解 @RequestBody.

另外， fetch默认不带cookie信息到后台，如果需要携带cookie信息，加上

options.credentials = 'include';