1
@GetMapping("/api/users/{id}")
2
public Result<User> getUserById(@PathVariable("id") Long id) {
3
    User user = userService.getById(id);
4
    return Result.success(user);
5
}

1
// 方式一：单独接收参数
2
@GetMapping("/api/users/search")
3
public Result<List<User>> searchUsers(
4
        @RequestParam(value = "keyword", required = false) String keyword,
5
        @RequestParam(value = "page", defaultValue = "1") Integer page) {
6
    return Result.success(userService.search(keyword, page));
7
}
8

9
// 方式二：使用对象接收（推荐用于参数较多时，不要加 @RequestBody）
10
@GetMapping("/api/users/list")
11
public Result<List<User>> listUsers(UserQueryDTO queryDTO) {
12
    return Result.success(userService.list(queryDTO));
13
}

1
@PostMapping("/api/users")
2
public Result<User> createUser(@RequestBody UserDTO userDTO) {
3
    User savedUser = userService.save(userDTO);
4
    return Result.success(savedUser);
5
}

1
@PostMapping("/api/users/upload")
2
public Result<String> uploadAvatar(
3
        @RequestParam("userId") Long userId,
4
        @RequestPart("file") MultipartFile file) { // 或使用 @RequestParam("file")
5

6
    if (file.isEmpty()) return Result.error("文件不能为空");
7
    String fileUrl = fileService.saveFile(file);
8
    return Result.success(fileUrl);
9
}

1
@GetMapping("/api/users/profile")
2
public Result<User> getProfile(
3
        @RequestHeader("Authorization") String token,
4
        @CookieValue(value = "sessionId", required = false) String sessionId) {
5
    // 解析 token 获取用户信息
6
    return Result.success(user);
7
}

1
@GetMapping("/api/files/download/{fileName}")
2
public ResponseEntity<Resource> downloadFile(@PathVariable String fileName) {
3
    Resource resource = fileService.loadFileAsResource(fileName);
4
    return ResponseEntity.ok()
5
            .header(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + resource.getFilename() + "\"")
6
            .body(resource);
7
}

1
import axios from 'axios';
2

3
// 1. 发送 GET 请求 (路径参数 + 查询参数)
4
const getUserAndSearch = async () => {
5
  // 对应后端 @PathVariable
6
  const res1 = await axios.get('/api/users/123');
7

8
  // 对应后端 @RequestParam
9
  const res2 = await axios.get('/api/users/search', {
10
    params: { keyword: 'Tom', page: 1 } // axios 会自动拼接成 ?keyword=Tom&page=1
11
  });
12
  console.log(res2.data); // 后端返回的 Result 对象
13
};
14

15
// 2. 发送 POST 请求 (JSON 数据)
16
const createUser = async () => {
17
  const userData = { name: 'Alice', age: 25 };
18
  // 对应后端 @RequestBody，axios 默认使用 application/json
19
  const res = await axios.post('/api/users', userData);
20
};
21

22
// 3. 上传文件 (FormData)
23
const uploadFile = async (fileObject) => {
24
  const formData = new FormData();
25
  formData.append('userId', '123');
26
  formData.append('file', fileObject); // fileObject 是从 <input type="file"> 获取的
27

28
  const res = await axios.post('/api/users/upload', formData, {
29
    headers: {
30
      'Content-Type': 'multipart/form-data' // 必须明确指定
31
    }
32
  });
33
};

1
// 1. 发送 GET 请求 (路径参数 + 查询参数)
2
const getUserAndSearch = async () => {
3
  // URL 参数需要手动拼接，或者使用 URLSearchParams
4
  const params = new URLSearchParams({ keyword: 'Tom', page: 1 });
5

6
  const response = await fetch(`/api/users/search?${params.toString()}`);
7
  const result = await response.json(); // 解析后端返回的 JSON
8
  console.log(result);
9
};
10

11
// 2. 发送 POST 请求 (JSON 数据)
12
const createUser = async () => {
13
  const userData = { name: 'Alice', age: 25 };
14

15
  const response = await fetch('/api/users', {
16
    method: 'POST',
17
    headers: {
18
      'Content-Type': 'application/json' // 必须告诉后端这是 JSON
19
    },
20
    body: JSON.stringify(userData) // 必须序列化为字符串
21
  });
22
  const result = await response.json();
23
};
24

25
// 3. 上传文件 (FormData)
26
const uploadFile = async (fileObject) => {
27
  const formData = new FormData();
28
  formData.append('userId', '123');
29
  formData.append('file', fileObject);
30

31
  const response = await fetch('/api/users/upload', {
32
    method: 'POST',
33
    // 注意：使用 fetch 传 FormData 时，千万**不要**手动设置 Content-Type 头！
34
    // 浏览器会自动设置正确的带有 boundary 的 multipart/form-data
35
    body: formData
36
  });
37
  const result = await response.json();
38
};