Ajax 在 Laravel 8 中返回 404 错误但路由存在

Posted 2023-03-14

【中文标题】Ajax 在 Laravel 8 中返回 404 错误但路由存在

【英文标题】：Ajax returns 404 error in Laravel 8 but the route exists

【发布时间】：2021-12-16 00:28:37

【问题描述】：

我正在我的表单中实现 JQuery Select2()。当我尝试搜索时，我的 ajax 总是返回 404 错误。但是路由存在于web.php文件中。

这是我的代码：

Web.php

Route::get('/searchByName/var1', [App\Http\Controllers\AppointmentsController::class, 'searchByName'])->name('searchByName');

JS 文件

$(document).ready(function() 

    url = $(".js-example-basic-single").attr('data-url');
    $.ajaxSetup(
            headers: 
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            
        );
    $(".js-example-basic-single").select2(
        dropdownParent: $('.name-search-box'),
        language: 
            inputTooShort: function () return "Plase enter minimum 3 caracteres";,
            minimumInputLength: function () return "Plase enter minimum 3 caracteres";,
            noResults: function () return "no results";
        ,
        minimumInputLength: 3,
        placeholder: "Select a patient",
        allowClear: true,
        width: "100%",
        debug: true,
        ajax: 
            type: "GET",
            url: "/searchByName",
            delay: 500,
            dataType: 'json',
            data: function (params) 
            var query = 
                search: params.term
            

            // Query parameters will be ?search=[term]&type=public
            return query;
            ,
            processResults: function (resp)  console.log('response' + resp);
                return 
                    results: resp
                
            ,
            cache: true
        

    );

AppointmentsController.php

public function searchByName($var1)
    
        $key = $request->get('search');
        $name = DB::table('patients_tbl')->select('id', 'first_name', 'middle_name', 'last_name')
                ->where('first_name', 'LIKE', "%$key%")->get()->toArray();
        
        return $name;
    

我试过带参数和不带参数的路由，清除了所有类型的缓存，包括路由缓存等，但没有用。

【问题讨论】：

你的 url 是 url:"/searchByName"，但是你的路由是 '/searchByName/var1' 你需要把你的 url 添加到变量中。

【参考方案1】：

我通过将方法从 GET 更改为 POST 并在 ajax 函数中添加带有参数的 _token 解决了这个问题。这是我更正的代码

JS 文件

$(document).ready(function() 

    //var uri = " route('searchByName', ':variable') ";
    //uri = uri.replace(':variable', var1);
    //alert(uri);
    var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
    $.ajaxSetup(
            headers: 
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            
        );
    $(".js-example-basic-single").select2(
        dropdownParent: $('.name-search-box'),
        language: 
            inputTooShort: function () return "Plase enter minimum 3 caracteres";,
            //minimumInputLength: function () return "Plase enter minimum 3 caracteres";,
            noResults: function () return "no results";
        ,
        minimumInputLength: 1,
        placeholder: "Select a patient",
        allowClear: true,
        width: "100%",
        debug: true,
        ajax: 
            type: "POST",
            url: '/searchByName',
            delay: 500,
            dataType: 'json',
            data: function (params) 
            return 
                _token: CSRF_TOKEN,
                search: params.term // search term
                ;
            ,
            processResults: function (data)  console.log(data);
                return 
                    results: $.map(data, function(obj) 
                        return  id: obj.id, text: obj.first_name ;
                    )
                ;
            ,
            cache: true
        

    );

);

和web.php

Route::post('/searchByName', [App\Http\Controllers\AppointmentsController::class, 'searchByName'])->name('searchByName');

【参考方案2】：

你的 ajax 文件中的路由没有提供参数。 在 url: "/searchByName" 但在路由中它有一个参数为 var1

ajax: 
   type: "GET",
   url: "/searchByName",
   delay: 500,
   dataType: 'json',
   data: function (params) 
   var query = 
       search: params.term

试试这个代码一次：

var uri = " route('searchByName', ':variable') ";
uri = uri.replace(':variable', var1);
$.ajax(
   url: uri,
   type: 'get',
   dataType: 'json',
   success: function(response) 
        console.log(response);
   );

【参考方案3】：

也许你的 js 是 fetch url 之类的

localhost/searchByName?search=abc

但是php中的路由是定义的

localhost/searchByName/abc 

不一样。