axios

axios常用轮子

post请求

正常用法

前端传数组，后端list接收

export const identifying = (data: string[]) => {  
  return request.post<string, boolean>(API.identifying, data)  
}

@PostMapping({"/startIdentifying"})  
public ResponseResult<Boolean> startIdentifying(@RequestBody List<String> ids) {  
    return ResponseResult.success(service.startIdentifying(ids));  
}

后端需要接收字符串

// 前端
// 构建数据
const formData = new FormData();  
formData.set('aaa', 'AAA');  
formData.set('ccc', 'CCC');
// 请求
await testPost1(formData);

// 后端
@PostMapping(value = "/testPost")  
public Result<String> testPost(@RequestParam String aaa) {  
    System.out.println("aaa！！ = " + aaa);  
    return Result.OK("收到参数：" + aaa);  
}

后端对象带集合的情况

// 后端对象
public class TestDto extends BaseDto {  
  
    @Schema(description = "账号ID，编辑时必填")  
    private String id;

	@Schema(description = "现在保存的媒体id")  
	private List<String> mediaList;

public class 
}

// 前端
const formDatas = new FormData()
// 将表单数据添加到FormData中
for (let i in submitData) {  
  formDatas.append(i, submitData[i])  
}  
//  
// 添加对象中的集合
tableData.value.forEach((media, index) => {  
  formDatas.append(`mediaList[${index}].fileName`, media.fileName)  
  formDatas.append(`mediaList[${index}].size`, media.size.toString())  
  formDatas.append(`mediaList[${index}].type`, media.type.toString())  
  formDatas.append(  
    `mediaList[${index}].mainImage`,  
    media.mainImage.toString()  
  )  
})  
formDatas.append(  
  'mainImgName',  
  tableData.value.filter((item) => item.mainImage === 1)?.[0]?.fileName || ''  
)
// 将多个文件添加到FormData中，此处的files名字要与后端对应
for (let i in fileList.value) { 
  formDatas.append('files', fileList.value[i].raw)  
}

// 后端，用TestDto接收表单数据，用MultipartFile[]接收多个文件
@PostMapping({"/add"})  
public ResponseResult<Boolean> add(@Valid TestDto dto,  
                                   @RequestPart(value = "files", required = false) MultipartFile[] files) {  
    return ResponseResult.success(service.add(dto, files), StringUtils.isBlank(dto.getId()) ? "新增成功" : "编辑成功");  
}

后端需要接收对象

// 前端请求
await testPost1({ aaa: 'AAA' });

方法1（通过定义的对象接收）

public class AaaRequest {
    private String aaa;

    // Getter 和 Setter
    public String getAaa() {
        return aaa;
    }

    public void setAaa(String aaa) {
        this.aaa = aaa;
    }
}

@PostMapping(value = "/testPost")
public Result<String> testPost(@RequestBody AaaRequest request) {
    String aaa = request.getAaa();
    System.out.println("aaa！！ = " + aaa);
    // 继续处理...
    return new Result<>(aaa);
}

方法2(通过String接收)

import com.fasterxml.jackson.databind.JsonNode;
import com.fasterxml.jackson.databind.ObjectMapper;

@PostMapping(value = "/testPost")
public Result<String> testPost(@RequestBody String requestBody) {
    try {
        ObjectMapper objectMapper = new ObjectMapper();
        JsonNode jsonNode = objectMapper.readTree(requestBody);
        String aaa = jsonNode.get("aaa").asText();
        System.out.println("aaa！！ = " + aaa);
        // 继续处理...
        return new Result<>(aaa);
    } catch (Exception e) {
        e.printStackTrace();
        return new Result<>(null);
    }
}

方法3（通过Map接收）

@PostMapping(value = "/testPost")
public Result<String> testPost(@RequestBody Map<String, String> requestBody) {
    String aaa = requestBody.get("aaa");
    System.out.println("aaa！！ = " + aaa);
    // 继续处理...
    return new Result<>(aaa);
}

方法4（通过HttpServletRequest接收）

@PostMapping(value = "/testPost")
public Result<String> testPost(HttpServletRequest request) {
    StringBuilder sb = new StringBuilder();
    try (BufferedReader reader = request.getReader()) {
        String line;
        while ((line = reader.readLine()) != null) {
            sb.append(line);
        }
    } catch (IOException e) {
        e.printStackTrace();
    }
    String requestBody = sb.toString();
    String aaa = parseAaaFromRequestBody(requestBody);
    System.out.println("aaa！！ = " + aaa);
    // 继续处理...
    return new Result<>(aaa);
}

private String parseAaaFromRequestBody(String requestBody) {
    // 简单解析，假设 JSON 格式是 {"aaa":"AAA"}
    int start = requestBody.indexOf("\"aaa\":\"") + 7;
    int end = requestBody.indexOf("\"", start);
    return requestBody.substring(start, end);
}

get请求

上传逗号分隔的字符串（就是数组toString()后的数据）

export const getResultByIds = (ids: string) => {  
  return request.get<string, any>(API.getByIds, { params: { ids } })  
}
// 调用
const result: any = await getResultByIds(  
  selectedRowKeys.value.toString()  
)

@PostMapping({"/getResultByIds"})  
public ResponseResult<Boolean> getResultByIds(@RequestBody List<String> ids) {  
    return ResponseResult.success(service.getResultByIds(ids));  
}