Question

这是我的第一个api项目。您能帮我提供我的代码吗？

我看不到问题。

这是我的控制者。

public function store(Request $request)
{
    //
   $valid=Validator::make($request->all(),[
      'text'=>'required',
      'body'=>'required'
   ]);

   if($valid->fails()){
       return response()->json(['message'=>$valid->messages()]);
   }else{

    $item= Item::create([
        'text'=>$request->input('text'),
        'body'=>$request->input('body')
    ]);
    return response()->json($item);
   }
}

这是我的表格。表格有什么问题吗？

<form id="form">
        <div class="form-group">
            <label>Text :</label>
            <input type="text" id="text" class="form-control col-sm-4">
        </div>

        <div class="form-group">
            <label>Body :</label>
            <textarea id="body" class="form-control col-sm-4"></textarea>
        </div>

        <div class="form-action">
            <input type="submit" class="btn btn-primary" value="submit">
        </div>
    </form>

和show函数之间的ajax代码正常工作，但我不知道问题出在哪里？。

$('#form').on('submit', function (e) {
        e.preventDefault();//prevent the form to submit to file
        let text = $('#text').val();
        let body = $('#body').val();
        addItems(text, body);
    });


    function addItems(text, body) {
        var item = {
            text: text,
            body: body
        };
        $.ajax({
            method: 'POST',
            url: 'http://localhost:8000/api/items',
            data: item,
            success: function (item) {
                alert('done the item number' + item.id + ' has been added!!');
                location.reload();
            },
            error: function () {
                alert('error')
            }
        })
    }

感谢您的帮助！

Answer 1

如果您的前端源与后端源分开，则添加cross-Origin Resource Sharing 打包到您的laravel项目中。

如果它在您的laravel视图上，则将csrf令牌添加到元标记- <meta name="csrf-token" content="{{ csrf_token() }}">

并与您的ajax请求{ _token : document.querySelector('meta[name="csrf-token"]').content}

一起发送

Answer 2

问题是您在发送表单时未发送跨站点请求伪造令牌。将指令@csrf添加到您的视图中然后将其发送给Hasan写的;）

laravel api ajax表单不会提交

2 个答案: