RESTful API 中如何处理前后端请求参数名不一致的问题？

在前后端分离的开发模式下，前端负责构建用户界面，后端负责数据处理与网络交互。RESTful API 作为连接前后端的桥梁，在数据传输过程中，前后端参数名不一致的问题屡屡出现。本文将详细介绍 RESTful API 中如何处理前后端参数名不一致的问题，并提供示例代码以供参考。

一、问题

RESTful API 的传参方式为 URL Query String，例如：

GET http://example.com/api/user?id=1&name=zhangsan&gender=male

对应的请求参数是 id、name 和 gender，后端根据这些参数进行处理。但是，前端使用的 JavaScript 变量名往往和后端不同，导致前后台参数名不一致：

const params = {
  userId: 1,
  userName: 'zhangsan',
  userGender: 'male'
};

此时，如何将前端参数转化为后端需要的参数名，并传入 RESTful API 呢？

二、解决方法

一种解决方法是在 RESTful API 中添加参数映射，将前端传入的参数转换为后端需要的参数名。代码示例如下：

const express = require('express');
const app = express();

const paramMapping = {
  userId: 'id',
  userName: 'name',
  userGender: 'gender'
};

app.get('/api/user', (req, res) => {
  const query = req.query;
  const newQuery = {};
  for (const key in query) {
    if (paramMapping[key]) {
      newQuery[paramMapping[key]] = query[key];
    }
  }
  // ...
  res.send();
});

在上述代码中，paramMapping 是前后端参数名映射表，当前端传入的参数名为 userId 时，后端使用的参数名为 id。app.get('/api/user') 表示处理 /api/user 的 GET 请求，其中 req.query 获取 URL Query String 参数列表，然后循环遍历参数名映射表进行参数转换，最后使用转换后的参数进行数据处理和返回。

另一种解决方法是在前端中进行参数转换，将前端 JavaScript 变量名转化为 RESTful API 需要的参数名。代码示例如下：

const axios = require('axios');

const paramMapping = {
  userId: 'id',
  userName: 'name',
  userGender: 'gender'
};

const params = {
  userId: 1,
  userName: 'zhangsan',
  userGender: 'male'
};

const newParams = {};
for (const key in params) {
  if (paramMapping[key]) {
    newParams[paramMapping[key]] = params[key];
  }
}

axios.get('http://example.com/api/user', {
  params: newParams
});

在上述代码中，paramMapping 是前后端参数名映射表，当前端传入的参数名为 userId 时，RESTful API 使用的参数名为 id。const newParams 是转换后的参数列表，通过循环遍历参数名映射表进行参数转换，最后使用转换后的参数调用 RESTful API。

三、总结

前后端参数名不一致是 RESTful API 开发中常见的问题，需要在前端或后端中进行参数转换。前后端参数名映射表进行参数转换，可以避免参数硬编码问题，提高代码可维护性和可读性。本文提供的解决方法不仅适用于 JavaScript，也适用于其他编程语言。希望本文对大家在 RESTful API 开发中遇到的问题能够提供一些指导意义。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65911c4deb4cecbf2d658894