Ajax 返回 GET 请求而不是 POST

Question

我正在尝试在 Laravel 中创建一个个人消息系统，该系统的一部分是能够以表单形式发送消息，而无需刷新整个页面。

我一直在关注一些 youtube 教程，这是我迄今为止的 Ajax 脚本。

<form id="form{{$dm->id}}">

                    {{ csrf_field() }}

                    <input id="message" placeholder="Send a message" style="border-radius: 0px;" type="username" class="form-control" name="message">

                    <script>

                    $('form{{$dm->id}}').ready(function (){

                        

                    $('form{{$dm->id}}').on('submit', function( event ) {

                        event.preventDefault();

                        $.ajax({

                            type: 'post',

                            url: '{{ route("sendMessage", $dm->id) }}',

                            data: $('form{{$dm->id}}').serialize(), 

                            success: function(response){

                                alert('suces')

                            },

                            error: function(response){

                               alert('failure')

                            }

                        });

                    });

                    });

                    </script>

                </form>

它不向控制器发送 POST 请求，而是发送 GET 请求并进行重定向。这是我第一次使用 Ajax/Javascript，所以我不知道为什么它不起作用。

控制器脚本：

public function sendM(Request $request, $id)

{

    $validatedData = $request->validate([

        'message' => 'required|string|max:255|min:4',

    ]);

    

    $dm = Dm::find($id);

    $mess = new Message;

    $mess->Authid = Auth::user()->id;

    $mess->Userid = $dm->Userid;

    $mess->Dmid = $dm->id;

    $mess->message = $request->input('message');

    $dm->messages()->save($mess);

    $dm->touch();

}

路由入口：

Route::post('/sendmessage/id{id}', 'SettingsController@sendM')->name('sendMessage')->middleware('verified');

很感谢任何形式的帮助！（注：抱歉，如果这是非常明显的事情）

Answer 1

方法的别名。如果您使用 1.9.0 之前的 jQuery 版本，则应该使用 type。&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<form id="form{{$dm->id}}">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; {{ csrf_field() }}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <input id="message" placeholder="Send a message" style="border-radius: 0px;" type="username" class="form-control" name="message">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <script>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $('form{{$dm->id}}').ready(function (){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $('form{{$dm->id}}').on('submit', function( event ) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; event.preventDefault();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; type: 'POST', //Check your JQ version.&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; method: 'POST', //Check your JQ version.&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; contentType:"multipart/form-data; charset=utf-8",&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; //url: '{{ route("sendMessage", $dm->id) }}',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; url: '{{ route("sendmessage", $dm->id) }}',&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; data: $('form{{$dm->id}}').serialize(),&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; success: function(response){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert('suces')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; error: function(response){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;alert('failure')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </script>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </form>

Answer 2

不确定它是否解决了您的问题，但您还必须将 csrf 令牌添加到标头中：$.ajaxSetup({&nbsp; &nbsp;headers: {&nbsp; &nbsp; &nbsp; 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')&nbsp; &nbsp;}});（当然，如果令牌位于元标记中）

Answer 3

在 $.ajax 调用中，您需要将方法设置为 post 而不是类型。$.ajax({&nbsp; &nbsp; &nbsp; &nbsp; method: 'post',&nbsp; &nbsp; &nbsp; &nbsp; url: '{{ route("sendMessage", $dm->id) }}',&nbsp; &nbsp; &nbsp; &nbsp; data: $('form{{$dm->id}}').serialize(),&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; success: function(response){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alert('suces')&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; error: function(response){&nbsp; &nbsp; &nbsp; &nbsp; alert('failure')&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp;});顺便说一句，jquery 通常被认为正在被淘汰。您可能想了解 jquery 的一些替代方案，例如 vue.js 或 React。具体到ajax方面，Laravel内置了axios支持。