讲师中心 微信公众号

工具推荐

视频效率加速
updream

一键生成高质量推广成片

Laper
Laper

剧本策划到成片协作

Seko
Seko

AI短剧一键生成成片

立刻MV
立刻MV

低成本歌曲 MV、视频生成

Laravel AJAX 404 错误排查与正确路由调用指南

千强大大_8416

千强大大_8416

发布时间:2025-12-31 12:47:02

|

868人浏览过

|

来源于php中文网

原创

Laravel AJAX 404 错误排查与正确路由调用指南

本文详解 laravel 中 ajax 请求返回 404 的常见原因,重点指出 url 构建错误(混淆 `url()` 与 `route()`),并提供基于命名路由的规范 ajax 调用方案。

在 Laravel 中使用 AJAX 时出现 404 错误,绝大多数情况源于前端请求 URL 与后端定义的路由不匹配。你当前的代码中存在一个关键矛盾:路由被命名为 'getFreeDay',但前端却用 {{ url('rezerwacja') }} 拼接路径,而该路径并未包含必需的 {reservation} 占位符参数,导致 Laravel 路由器无法匹配。

首先,你的路由定义为:

Route::post('/rezerwacja/{reservation}', [ReservationController::class, 'getFreeDay'])->name('getFreeDay');

这是一个 POST 方法、带动态参数 {reservation} 的命名路由。但你的 AJAX 配置中:

const getFreeDay = "{{ url('rezerwacja')}}/"; // ❌ 错误:url() 不支持参数绑定,且缺少 {reservation}
url: getFreeDay + $(this).val(), // 实际发出如 `/rezerwacja/123` —— 但 Laravel 期望的是 `/rezerwacja/{reservation}`,而此处 `123` 被当作 `reservation` 值?未必合法!

问题在于:url('rezerwacja') 仅生成 /rezerwacja(无尾部斜杠),拼接后变成 /rezerwacja/123,但路由要求的是 /rezerwacja/{reservation} —— 看似结构一致,实际缺失关键上下文:{reservation} 必须对应一个有效的 Reservation 模型实例 ID(Laravel 隐式模型绑定依赖此)。若传入的 $(this).val() 并非数据库中存在的 Reservation ID(而是 Service ID),则路由根本不会命中,直接 404。

✅ 正确做法是:统一使用 route() 辅助函数生成完整、带参数的 URL,并确保参数语义正确。

Expanso yaml-to-json
Expanso yaml-to-json

使用 Expanso Edge 管道将 YAML 输入转换为 JSON 格式。

下载

✅ 正确的 AJAX 实现(推荐)

假设你真正想传递的是 service_id(来自 select 的 value),而非 reservation(因为下拉项是 $services),那么路由设计本身可能就有逻辑偏差。更合理的方案是:

  1. 修正路由(不依赖 Reservation 模型绑定):

    // routes/web.php
    Route::post('/api/free-days', [ReservationController::class, 'getFreeDay'])->name('api.free-days');
  2. 前端使用 route() 生成 URL,并显式传参:

    <!-- 确保页面包含 CSRF meta 标签 -->
    <meta name="csrf-token" content="{{ csrf_token() }}">
    $("select#select-service").change(function () {
     const serviceId = $(this).val();
    
     $.ajax({
         method: 'POST',
         url: '{{ route("api.free-days") }}', // ✅ 正确:由 Laravel 解析命名路由
         headers: {
             'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
         },
         data: {
             service_id: serviceId // 显式传参,语义清晰
         },
         dataType: 'json'
     })
     .done(function (response) {
         console.log('Success:', response);
         // ✅ 处理返回数据,避免盲目 reload
         // window.location.reload();
     })
     .fail(function (xhr) {
         console.error('Error:', xhr.responseJSON?.message || 'Request failed');
     });
    });
  3. 控制器适配(移除隐式绑定,接收普通请求):

    public function getFreeDay(Request $request): JsonResponse
    {
     $serviceId = $request->input('service_id');
    
     try {
         // 此处根据 $serviceId 查询空闲日期等业务逻辑
         return response()->json([
             'status' => 'success',
             'data' => ['free_dates' => []] // 示例数据
         ]);
     } catch (\Exception $e) {
         return response()->json([
             'status' => 'error',
             'message' => 'Wystąpił błąd'
         ])->setStatusCode(500);
     }
    }

⚠️ 关键注意事项

  • 不要混用 url() 和 route():url() 用于绝对路径拼接(如 url('assets/js/app.js')),route() 专用于命名路由(自动处理参数、HTTPS、子目录等)。
  • 方法必须一致:路由定义为 POST,AJAX method 也必须是 'POST'(你原代码误写为 'GET')。
  • CSRF 保护必开:Laravel 默认启用,AJAX POST/PUT/DELETE 必须携带 X-CSRF-TOKEN。
  • 避免 window.location.reload() 在 .done() 中无条件执行:这会中断用户操作,应改为动态更新 DOM(如填充日历控件)。

遵循以上方案,即可彻底解决 404 问题,并构建可维护、符合 Laravel 最佳实践的 AJAX 交互。

相关文章

路由优化大师
路由优化大师

路由优化大师是一款及简单的路由器设置管理软件,其主要功能是一键设置优化路由、屏广告、防蹭网、路由器全面检测及高级设置等,有需要的小伙伴快来保存下载体验吧!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热门AI工具

更多
WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

火山引擎

火山引擎是一款面向企业的云计算与AI服务平台。

Atoms
Atoms Hot

Atoms是一款AI智能体工具,第一支自动构建真实业务的 AI 团队。

立刻MV
立刻MV Hot

立刻MV是一款AI文本写作工具,AI 音乐视频(MV)创作工具。

讯飞绘文

讯飞绘文是一款由科大讯飞推出的一站式 AIGC 内容运营平台。

Lovart
Lovart Hot

一款面向视觉设计创作的AI设计平台,可通过智能体和画布工作流辅助制作海报、Logo、网页、PPT及其他视觉内容。

蛙蛙写作

一款AI论文写作工具,主要用于超级AI智能写作助手,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

相关专题

更多
laravel组件介绍
laravel组件介绍

laravel 提供了丰富的组件,包括身份验证、模板引擎、缓存、命令行工具、数据库交互、对象关系映射器、事件处理、文件操作、电子邮件发送、队列管理和数据验证。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

897

2024.04.09

laravel中间件介绍
laravel中间件介绍

laravel 中间件分为五种类型:全局、路由、组、终止和自定。想了解更多laravel中间件的相关内容,可以阅读本专题下面的文章。

875

2024.04.09

laravel使用的设计模式有哪些
laravel使用的设计模式有哪些

laravel使用的设计模式有:1、单例模式;2、工厂方法模式;3、建造者模式;4、适配器模式;5、装饰器模式;6、策略模式;7、观察者模式。想了解更多laravel的相关内容,可以阅读本专题下面的文章。

2528

2024.04.09

thinkphp和laravel哪个简单
thinkphp和laravel哪个简单

对于初学者来说,laravel 的入门门槛较低,更易上手,原因包括:1. 更简单的安装和配置;2. 丰富的文档和社区支持;3. 简洁易懂的语法和 api;4. 平缓的学习曲线。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

4921

2024.04.10

laravel入门教程
laravel入门教程

本专题整合了laravel入门教程,想了解更多详细内容,请阅读专题下面的文章。

7230

2025.08.05

laravel实战教程
laravel实战教程

本专题整合了laravel实战教程,阅读专题下面的文章了解更多详细内容。

4756

2025.08.05

laravel面试题
laravel面试题

本专题整合了laravel面试题相关内容,阅读专题下面的文章了解更多详细内容。

8889

2025.08.05

PHP高性能API设计与Laravel服务架构实践
PHP高性能API设计与Laravel服务架构实践

本专题围绕 PHP 在现代 Web 后端开发中的高性能实践展开,重点讲解基于 Laravel 框架构建可扩展 API 服务的核心方法。内容涵盖路由与中间件机制、服务容器与依赖注入、接口版本管理、缓存策略设计以及队列异步处理方案。同时结合高并发场景,深入分析性能瓶颈定位与优化思路,帮助开发者构建稳定、高效、易维护的 PHP 后端服务体系。

1516

2026.03.04

Postman身份认证怎么配置
Postman身份认证怎么配置

本专题从实际API接口调试场景出发,讲解Postman身份认证的完整配置流程,包括常见认证协议介绍、授权参数设置、访问令牌填写、OAuth 2.0授权及认证失败排查,帮助用户正确完成接口授权与访问验证。

60

2026.11.06

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
墨刀帮助中心
墨刀帮助中心

共0课时 | 0人学习

MyEclipse学习中心
MyEclipse学习中心

共0课时 | 0人学习

Apache Subversion 官方手册
Apache Subversion 官方手册

共0课时 | 0人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn