此路由不支持POST方法.支持的方法:GET、HEAD.在Laravel 7和AJAX

Question

我试图在Laravel 7中使用Ajax插入数据。每次我点击提交按钮，它显示错误。The POST method is not supported for this route. Supported methods: GET, HEAD.

当我清空表单中的method=""时，什么也没有发生。我还试图通过在Form之后写入@method=''来覆盖该方法，但它也不起作用

这是我在叶片视图下的表单。

<form action="" method="POST" class="btn-submit">
@csrf
<input type="email" name="email" class="form-control" placeholder="Email" required="">
<span class="input-group-btn">
<button class="btn btn-success" id="sendBtn">Submit</button>
</span>
</form>

This is my Route

Route::post('/subscription', [AppHttpControllersCustomerController::class, 'storeSubscription'])
->name('subscription');

这是我的ajax部分布局

<script>
$(document).ready(function() {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$("body").on("click","#sendBtn" function(e){
e.preventDefault();
var email = $("input[name=email]").val();
var url = '{{ route('subscription') }}';
$.ajax({
url:url,
method: "POST",
data:{
Code:email, 
},
success:function(response){
if(response.success){
alert(response.message) //Message come from controller
}else{
alert("Error")
}
},
error:function(error){
console.log(error)
}
});
});
</script>

这是控制器

public function storeSubscription(Request $request)
{
DB::table('subscriptions')->insert([
'email' => $request->Code, //This Code coming from ajax request
]);
return response()->json([
'success' => true,
'message' => 'Data inserted successfully'
]);
}

Answer 1

在表单没有中断地提交时，不要监听提交按钮上的click事件，而是像这样监听表单提交事件:

$("body").on("submit", ".btn-submit", function(e){
e.preventDefault();
var email = $("input[name=email]").val();
var url = "{{ route('subscription') }}";
$.ajax({
url:url,
method: "POST",
data:{
Code:email, 
},
success:function(response){
if(response.success){
alert(response.message) //Message come from controller
}else{
alert("Error")
}
},
error:function(error){
console.log(error)
}
});
});

Answer 2

根据API中form或postman使用的方法更改路由

$router->post('route/url','ControllerName@functionName');
<form method="post">
@csrf
</form>

Answer 3

试着像这样打印路由名:

var url = "@php echo route('subscription') @endphp";

如果它仍然不能工作，确保路由名称是正确的，你可以通过在terminal中运行php artisan r:l来完成，它应该会打印出路由名称。