Vue.js传递含斜杠的路径参数，Laravel路由仅获取末段文件名的问题

两个问题叠加导致拿不到完整路径：

• Laravel 路由默认对占位符{path}的匹配规则是禁止包含斜杠的，哪怕前端已经把斜杠编码成%2F，服务端也会自动截断参数，只把最后一段字符绑定给这个占位符
• 控制器里用$request->path调试的取参方式本身就是错的：这个方法是用来获取整个请求的URI全路径的，不是拿路由定义里{path}占位符绑定的单个参数值，自然拿不对

方案1：最小改动适配现有逻辑 #

不用改前端已经写好的编码传参逻辑，两步调整即可解决：

1. 给路由加参数匹配约束 #

默认路由的正则太严格，直接放开限制，让{path}可以匹配所有字符（包括编码后的斜杠）：

// 原有路由
Route::get('delete-gallery/{path}', 'API\Controller@deleteGallery');

// 修改后路由
Route::get('delete-gallery/{path}', 'API\Controller@deleteGallery')
    ->where('path', '.*');

2. 调整控制器取参逻辑 #

抛弃原来用$request->path的取参方式，两种正确写法任选：

• 直接给控制器方法加和路由占位符同名的形参，Laravel会自动把路由参数注入方法

public function deleteGallery(string $path)
{
    // 把编码后的路径解码，还原成类似 post/foldername/xxx.png 的原始格式
    $fullImagePath = urldecode($path);
    // 后续走图片删除逻辑
}

• 从路由实例中直接取绑定的参数

public function deleteGallery(Request $request)
{
    $encodedPath = $request->route('path');
    $fullImagePath = urldecode($encodedPath);
    // 后续逻辑
}

特殊情况处理

如果改完路由还是拿不到完整参数，检查Web服务配置：

• Apache环境需要在站点配置里开启AllowEncodedSlashes On，允许传递编码后的斜杠字符
• Nginx环境需要关掉自动合并、解码斜杠的配置，避免编码后的%2F被解析成实际路径分隔符，当成多层路由匹配触发404

方案2：无法调整服务端配置时的兜底方案 #

如果是共享主机环境，没法修改Web服务的全局配置，直接绕开路径传参的限制，把图片路径作为Query参数传递，从根源上避开斜杠截断的问题：

前端调整 #

不需要手动写encodeURIComponent，axios会自动处理Query参数的编码：

removeImage: function(index, img_path) {
  axios.get(`/api/backend/delete-gallery`, {
    params: {
      image_path: img_path
    },
    headers: this.header()
  }).then((response) => {

路由调整 #

去掉路由里的路径占位符

Route::get('delete-gallery', 'API\Controller@deleteGallery');

控制器取参 #

Laravel会自动解码Query参数，不需要额外处理：

public function deleteGallery(Request $request)
{
    $fullImagePath = $request->query('image_path');
    // 后续删除逻辑
}

• 拿到路径参数后必须手动做一次URL解码，别把带%2F的编码值存进数据库或者直接传给文件操作函数
• 不要把$request->path()的返回值当路由占位参数用，这个方法返回的是从根路径开始的全URI字符串，和你在路由里定义的{path}占位符没有绑定关系

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