此路由不支持 POST 方法。支持的方法：使用 laravel/ajax 的 GET、HEAD答案

【问题标题】：The POST method is not supported for this route. Supported methods: GET, HEAD using laravel/ajax此路由不支持 POST 方法。支持的方法：使用 laravel/ajax 的 GET、HEAD
【发布时间】：2021-06-20 20:57:31
【问题描述】：

我有以下 HTML：

<div class="row">
        <div class="col-12">
            <div class="card mb-4">
                <div class="card-body">
                    <h5 class="mb-4">Projet</h5>
                    <form id="projetform" method="post" action="ajout_projet" class="myForms"  enctype="multipart/form-data">
                        {{ csrf_field() }}
                        <input type="hidden" id="id_hidden" name="id_projet" />
                        <div class="form-group">
                            <label for="inputAddress">Numéro de projet</label>
                            <input type="text" class="form-control" id="numero_projet" name="numero_projet" 
                            placeholder="Description">
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="inputState">Client</label>
                                <select id="id_client" class="form-control" name="id_client">
                                <option selected>Choose...</option>
                                 @foreach($clients as $client)
                                     <option data-id="{{$client->id_client}}" value="{{$client->id_client}}">{{$client->client}}</option>
                                 @endforeach
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label for="inputState">Agence de Conseil</label>
                                <select id="id_agence_conseil" class="form-control" name="id_agence_conseil">
                                <option selected>Choose...</option>
                                @foreach($agences_conseil as $agence_conseil)
                                     <option data-id="{{$agence_conseil->id_agence_conseil}}" value="{{$agence_conseil->id_agence_conseil}}">{{$agence_conseil->agence_conseil}}</option>
                                @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="inputState">Agence de Production</label>
                                <select id="id_agence_production" class="form-control" name="id_agence_production">
                                <option selected>Choose...</option>
                                @foreach($agences_production as $agence_production)
                                   <option data-id="{{$agence_production->id_agence_production}}" value="{{$agence_production->id_agence_production}}">{{$agence_production->agence_production}}</option>
                                @endforeach
                                </select>
                            </div>
                            <div class="form-group col-md-6">
                                <label for="inputState">Agence de Casting</label>
                                <select id="id_agence_casting" class="form-control" name="id_agence_casting">
                                <option selected>Choose...</option>
                                 @foreach($agences_casting as $agence_casting)
                                   <option data-id="{{$agence_casting->id_agence_casting}}" value="{{$agence_casting->id_agence_casting}}">{{$agence_casting->agence_casting}}</option>
                                @endforeach
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label for="description">Description</label>
                            <input type="text" class="form-control" id="description" name="description" 
                            placeholder="Description">
                        </div>
                        <div class="form-row">
                            <div class="form-group col-md-6">
                                <label for="date_tournage">Date de tournage</label>
                                <div class="input-group date">
                                    <input type="text" class="form-control" id="date_tournage" name="date_tournage">
                                    <span class="input-group-text input-group-append input-group-addon" id="spanEstPaymentDate">
                                        <i class="simple-icon-calendar"></i>
                                    </span> 
                                </div>
                            </div>
                            <div class="form-group col-md-6">
                                <label for="date_premiere_diffusion">Date de première diffusion</label>
                                <div class="input-group date">
                                    <input type="text" class="form-control" id="date_premiere_diffusion" name="date_premiere_diffusion">
                                    <span class="input-group-text input-group-append input-group-addon" id="spanEstPaymentDate">
                                        <i class="simple-icon-calendar"></i>
                                    </span> 
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <div class="row"> 
        <div class="col-12 col-md-12 col-xl-8 col-left">
            <div class="card mb-4">
                <div class="card-body">
                    <button type="button" class="btn btn-outline-primary mb-1 add_new_frm_field_btn">Ajouter un nouveau casting</button> 
                    </br>
                    </br>

                    <div class="row">
                        <div class="col-12">
                            <div class="card mb-4 form_field_outer  ">
                                <div class="card-body form_field_outer_row ">
                                    <form>
                                        <div class="form-row">
                                            <div class="form-group col-md-4">
                                                <label for="inputState">Casting</label>
                                                <select id="id_casting" class="form-control" name="id_casting">
                                                <option selected>Choose...</option>
                                                @foreach($castings as $casting)
                                                   <option data-id="{{$casting->id_casting}}" value="{{$casting->id_casting}}">{{$casting->nom.' '.$casting->prenom}}</option>
                                                @endforeach
                                                </select>
                                            </div>
                                            <div class="form-group col-md-4">
                                                <label for="inputState">Type de contrat</label>
                                                <select id="id_modele_contrat" class="form-control" name="id_modele_contrat">
                                                <option selected>Choose...</option>
                                                <option>...</option>
                                                </select>
                                            </div>
                                            <div class="card-body ">
                                                <button type="button" class="btn btn-outline-warning mb-1 remove_node_btn_frm_field">Delete</button>
                                            </div>
                                        </div> 
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-12 col-md-12 col-xl-4 col-right">
            <div class="card mb-4">
                <div class="position-absolute card-top-buttons">
                    <button class="btn btn-header-light icon-button">
                    <i class="simple-icon-refresh"></i>
                    </button>
                </div>
                <div class="card-body">
                    <h5 class="card-title">Castings choisis</h5>
                    <div>
                        <div class="card mb-4 casting_details  ">
                            <div class="card-body casting_details2 ">
                                <div class="d-flex flex-row mb-3 ">
                                    <a class="d-block position-relative" href="#">
                                    <img src="img/products/marble-cake-thumb.jpg" alt="Marble Cake"
                                    class="list-thumbnail border-0" />
                                    <span
                                    class="badge badge-pill badge-theme-2 position-absolute badge-top-right">NEW</span>
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div> 
        <button type="submit" name="submit" id="submit" class="btn btn-primary mb-1">Add</button>
    </div>

我的视图如下所示：

我添加了一个脚本，该脚本可以动态添加带有输入字段的行并删除第二个表单中的行

<script type="text/javascript">

$(document).ready(function(){

$("body").on("click",".add_new_frm_field_btn", function (){ 

    console.log("clicked");

    var index = $(".form_field_outer").find(".form_field_outer_row").length + 1;
    $(".form_field_outer").append(
        `
        <div class="col-12">

        <div class="card-body form_field_outer_row">

        <div class="form-row">
        <div class="form-group col-md-4">
        <label for="inputState">Casting</label>
            <select id="id_casting" class="form-control" name="id_casting">
                <option selected>Choose...</option>
                @foreach($castings as $casting)
                  <option data-id="{{$casting->id_casting}}" value="{{$casting->id_casting}}">{{$casting->nom.' '.$casting->prenom}}</option>
                  @endforeach
             </select>
        </div>
        <div class="form-group col-md-4">
        <label for="inputState">Type de contrat</label>
        <select id="id_modele_contrat" class="form-control" name="id_modele_contrat">
        <option selected>Choose...</option>
        <option>...</option>
        </select>
        </div>

        <div class="card-body ">

        <button type="button" class="btn btn-outline-warning mb-1 remove_node_btn_frm_field">Delete</button>

        </div>

        </div>

        </div>

        </div>
        `);

    $(".form_field_outer").find(".remove_node_btn_frm_field:not(:first)").prop("disabled", false);
    $(".form_field_outer").find(".remove_node_btn_frm_field").first().prop("disabled", true);

});


});

$(document).ready(function(){
//===== delete the form fieed row
$("body").on("click", ".remove_node_btn_frm_field", function () {
console.log("click");
$(this).closest(".form_field_outer_row").remove();
console.log("success");
});
});
</script>

当我点击按钮 Ajouter un nouveau casting 时，它会添加一个带有两个输入字段的新行：Casting and Type Contrat

现在我正在尝试将数据存储在数据库中。

我应该得到第一种形式的输入和第二种形式的多行

为此，我首先使用以下 ajax 代码将 first form 存储在数据库中：

<script type="text/javascript">

$('.myForms').submit(function(){

     event.preventDefault();

     $.ajax({

            url:"{{ route('ajout_projet.store') }}",
            method:"POST",
            data: new FormData(this),
            dataSrc: "",
            contentType: false,
            cache:false,
            processData: false,
            dataType:"json",
            success:function(data)
            {
             var html = '';
             if(data.errors)
             {
              html = '<div class="alert alert-danger">';
              for(var count = 0; count < data.errors.length; count++)
              {
               html += '<p>' + data.errors[count] + '</p>';
              }
              html += '</div>';
             }
             if(data.success)
             {
              alert('je suis là');
              html = '<div class="alert alert-success">' + data.success + '</div>';
              $('#castingform')[0].reset();
             /* $('#datatableRows').DataTable().ajax.reload();*/

             table.clear().rows.add(data).draw();
             }
             $('#form_result').html(html);
            }
           });
});


$("#submit").click(function () {
    $(".myForms").trigger('submit'); // should show 3 alerts (one for each form)

});

</script>

还有我的控制器：

 public function store(Request $request)
    {
 if(request()->ajax())
        {
        $projets = new Projet();

        $rules = array(

         'numero_projet' => 'required',
         'id_client' => 'required',
         'id_agence_conseil' => 'required|unique:castings',
         'id_agence_production' => 'required',
         'id_agence_casting' => 'required',
         'description' => 'required',
         'date_tournage' => 'required',
         'date_premiere_diffusion' => 'required'
      
            
             );
          
            $error = Validator::make($request->all(), $rules);

                    if($error->fails())
                    {
                        return response()->json(['errors' => $error->errors()->all()]);
                    }
             
}

             $projets->numero_projet = $request['numero_projet'];
             $projets->id_client = $request['id_client'];
             $projets->id_agence_conseil = $request['id_agence_conseil'];
             $projets->id_agence_production = $request['id_agence_production'];
             $projets->id_agence_casting = $request['id_agence_casting'];
             $projets->description = $request['description'];
             $projets->date_tournage = $request['date_tournage'];
             $projets->date_premiere_diffusion = $request['date_premiere_diffusion'];
             $projets->id_filiale = Auth::user()->id_filiale;
             $projets->id_filiale = Auth::user()->id;
             $projets->save();


            return response()->json(['success' => 'Data Added successfully.']);  


    }

我的路线：

Route::group(['middleware' => ['auth','role:account_manager|admin|manager_de_filiale']], function() { 
    Route::post('ajout_projet/store', 'App\Http\Controllers\ProjetController@store')->name('ajout_projet.store');
});

但是当我执行我的代码时，我收到以下错误：

Symfony\Component\HttpKernel\Exception\MethodNotAllowedHttpException
The POST method is not supported for this route. Supported methods: GET, HEAD.

更新

请看看我的代码有什么问题，我没有输入问题出在哪里

【问题讨论】：

您的代码没有问题。问题只是当端点只接受 GET 或 HEAD 时，您正在发送 POST AJAX 请求。更改请求类型。需要注意的一件事是，您将无法在 GET 请求中发送 FormData。如果您可以控制服务器端代码，我建议您添加 POST 支持。
如何添加 POST 支持？
Route::post 通常定义一个接受 POST 的路由。尝试删除围绕它的身份验证.. 解决了吗？
@Squiggs ，不解决问题
您可以将浏览器在网络选项卡中发送的内容发布到该路由吗？它看起来像是在执行 POST 吗？

标签： jquery ajax laravel

【解决方案1】：

由于您的帖子与您的视图在同一 URL 下不同，因此您必须定义操作以转到正确的 URL。

<form method="POST" action="{{ route('ajout_projet.store') }}">

如果您使用名称路由，这通常是更可靠且相当简单的方法。

【讨论】：