TS/Express服务链式GET请求传参触发404错误该如何解决

一、404问题原因 #

你用GET请求携带body传参不符合HTTP规范，绝大多数服务器、代理服务都会直接忽略GET请求的body，导致你解构拿到的query为undefined，拼接出的外部API路径为空段，自然返回404。

二、动态传参正确实现（保持GET语义） #

GET请求传参有两种标准方案，按需选择即可：

方案1：查询参数（推荐，灵活度高） #

• 前端请求格式：GET /api/v1/product?query=adidas
• 服务端从req.query中取值

方案2：路径参数（符合RESTful风格） #

• 前端请求格式：GET /api/v1/product/adidas
• 服务端从req.params中取值

三、是否需要改为POST请求？ #

不需要。你的场景是纯数据查询，没有修改服务端任何资源，GET的语义完全匹配，强行用POST反而不符合接口设计规范。

四、是否可以直接前端调用外部API？ #

分场景判断：

• 如果仅做前端功能验证、且该API没有跨域限制，可以直接前端调用，减少不必要的转发层。
• 如果有以下需求，必须走后端转发：
  • 该外部API存在跨域限制，前端直接调用会报CORS错误
  • 后续需要加请求缓存、频率限制、参数校验、数据脱敏等统一处理逻辑
  • 后续该API需要添加密钥凭证，避免密钥暴露在前端代码中

五、修正后完整代码示例 #

路由代码（查询参数版本） #

// product.route.ts
import { Express } from "express"
import { getProductData } from "../controllers/product.controller"

// 若可通过API获取定价则无需将产品数据写入数据库，当前不处理支付逻辑，遵循KISS原则
const productRoute = (app: Express) => {
  app.get("/api/v1/product", getProductData)
}

export { productRoute }

控制器代码 #

// product.controller.ts
import { Request, Response } from "express"
import axios, { AxiosResponse } from "axios"

const getProductData = async (req: Request, res: Response) => {
  try {
    // 从查询参数取值并做校验
    const query = req.query.query as string
    if (!query) {
      return res.status(400).json({ error: "缺少产品查询参数" })
    }
    const api: string = `https://api.exchange.shoes.com/products/${query}/stats`
    const response: AxiosResponse = await axios.get(api)
    // 直接返回响应即可，无需额外赋值await
    return res.json(response.data)
  } catch (error) {
    return res.status(500).json({ error: "产品信息查询失败" })
  }
}

export { getProductData }

注：原代码中await res.json()是冗余写法，res.json是Express的响应终止方法，调用后直接会把结果返回给前端，不需要await也不需要赋值返回。

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