如何避免PHP将Vue.js传入的null/undefined参数识别为字符串

方法一：动态拼接URL + Laravel可选路由参数 #

在Vue端判断参数是否有效，仅当参数不为null/undefined时才拼接到URL中，同时将Laravel路由的第二个参数设为可选：

Vue代码修改：

myFunction(id1, id2 = null) {
  let url = `/api/model1/${id1}/model2`;
  if (id2 !== null && id2 !== undefined) {
    url += `/${id2}`;
  }
  axios.post(url)
    .then((response) => {
        console.log(response);
    })
    .catch(err => {
        console.log(err);
    });
}

Laravel路由修改：

// routes/api.php
Route::post('model1/{id}/model2/{id2?}', 'SomeController@doThis');

此时当id2为null时，请求路径为/api/model1/987/model2，Laravel控制器中$id2参数会自动被解析为null。

方法二：Laravel控制器内统一转换参数 #

如果不想修改前端逻辑，可以在控制器方法里直接处理参数，将字符串'null'/'undefined'转为null：

public function doThis($id, $id2) {
    // 转换无效字符串为null
    if (in_array($id2, ['null', 'undefined'], true)) {
        $id2 = null;
    }
    // 执行后续业务逻辑
}

方法三：用查询字符串传递可选参数 #

将可选参数从路由路径移到查询字符串中，这样参数不存在时不会出现在URL里，Laravel端获取时自动为null：

Vue代码修改：

myFunction(id1, id2 = null) {
  const queryParams = {};
  if (id2 !== null && id2 !== undefined) {
    queryParams.id2 = id2;
  }
  axios.post(`/api/model1/${id1}/model2`, {}, { params: queryParams })
    .then((response) => {
        console.log(response);
    })
    .catch(err => {
        console.log(err);
    });
}

Laravel路由修改：

// routes/api.php
Route::post('model1/{id}/model2', 'SomeController@doThis');

控制器获取参数：

public function doThis($id) {
    $id2 = request()->query('id2'); // 未传递时返回null
    // 执行后续业务逻辑
}

这种方式更符合RESTful设计规范，避免路径中出现非语义化的字符串值。

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