Axios POST请求参数后端无法读取问题求助

问题根源分析 #

核心矛盾是前端Axios参数传递方式与后端解析逻辑不匹配：

• Axios的params字段用于拼接URL查询参数，而非放入请求体；若错误将params塞进请求体，后端用r.URL.Query()必然拿不到数据。
• 若前端把分页参数、过滤条件都放在请求体里，后端未正确解析请求体，也会导致读取失败。

具体解决方案 #

方案1：分页参数放URL查询参数（推荐） #

前端Axios修正写法

Axios POST的正确参数结构：第二个参数是请求体data，第三个参数是配置项（含params），分页参数会自动拼到URL后：

axios.post('/api/your-endpoint',
  // 请求体：存放过滤条件
  { filter: { status: 'active', keyword: 'test' } },
  // 配置项：分页参数放params
  { params: { page: 1, pageSize: 10 } }
);

此时浏览器Network中，URL会显示/api/your-endpoint?page=1&pageSize=10，请求体仅包含filter数据。

后端Go解析逻辑

用r.URL.Query()读取URL参数，同时解析请求体里的过滤条件：

import "strconv"

// 读取分页参数
pageStr := r.URL.Query().Get("page")
pageSizeStr := r.URL.Query().Get("pageSize")

// 转换为整数（需处理错误，示例简化）
page, _ := strconv.Atoi(pageStr)
pageSize, _ := strconv.Atoi(pageSizeStr)

// 解析请求体中的filter
type Filter struct {
  Status  string `json:"status"`
  Keyword string `json:"keyword"`
}
type RequestBody struct {
  Filter Filter `json:"filter"`
}

var reqBody RequestBody
err := json.NewDecoder(r.Body).Decode(&reqBody)
if err != nil {
  http.Error(w, "invalid request body", http.StatusBadRequest)
  return
}
// 使用reqBody.Filter.Status等字段

方案2：所有参数放请求体（不推荐分页参数这么做） #

若业务需要把分页参数也放进请求体，调整前后端逻辑：

前端Axios写法

直接把所有数据放在请求体data中：

axios.post('/api/your-endpoint', {
  page: 1,
  pageSize: 10,
  filter: { status: 'active', keyword: 'test' }
});

后端Go解析逻辑

定义对应结构体解析整个请求体：

type RequestBody struct {
  Page     int    `json:"page"`
  PageSize int    `json:"pageSize"`
  Filter   struct {
    Status  string `json:"status"`
    Keyword string `json:"keyword"`
  } `json:"filter"`
}

var reqBody RequestBody
err := json.NewDecoder(r.Body).Decode(&reqBody)
if err != nil {
  http.Error(w, "invalid request body", http.StatusBadRequest)
  return
}

// 直接使用reqBody.Page、reqBody.PageSize、reqBody.Filter.Status等字段

关键检查点 #

1. 请求Content-Type：确保前端发送的是application/json（Axios默认会设置，除非手动修改），后端不要强制要求form-data或x-www-form-urlencoded。
2. 请求Dump验证：查看Dump里的Request URL是否带分页参数，Request Body的格式是否为JSON，避免格式不匹配导致解析失败。

内容的提问来源于stack exchange，提问作者Mike3355