Laravel 5.3中ajax POST的最小工作示例 [英] Minimum Working Example for ajax POST in Laravel 5.3
问题描述
有人可以用一个完整的最小示例来解释Laravel 5.3中的ajax post方法吗? 我知道网络上有一些资源，但是我想念一个简洁，直接的最小示例.
Can someone please explain the ajax post method in Laravel 5.3 with a full-working minimum example? I know there are some resources in the web, but I miss a concise, straight-forward minimum example.
推荐答案
我假设您对模型-控制器-视图范例有基本的了解，对Laravel的基本了解以及对JavaScript和JQuery的基本了解(我将出于简单起见，请使用.)
I presume you have a basic understanding of the model-controler-view paradigm, a basic understanding of Laravel and a basic understanding of JavaScript and JQuery (which I will use for reasons of simplicity).
我们将创建一个编辑字段和一个发布到服务器的按钮. (这适用于Laravel 5.0至5.6的所有版本)
We will create an edit field and a button which posts to the server. (This works for all versions from Laravel 5.0 to 5.6)
首先，您需要将路由添加到您的 routes/web.php 中.就像您从普通视图中所知道的那样，为该视图创建一条路线:
At first you need to add routes to your routes/web.php. Create one route for the view, just as you know from ordinary views:
Route::get('ajax', function(){ return view('ajax'); });
您需要创建的第二条路由是处理ajax发布请求的路由.请注意，它正在使用 post 方法:
The second route you need to create is the route that handles the ajax post request. Take notice that it is using the post method:
Route::post('/postajax','AjaxController@post');
2.控制器功能
在您刚才创建的(第二条)路由中，调用了 AjaxController 中的Controller函数 post .因此，创建控制器
2. The Controller Function
In the (second) route you created just now, the Controller function post in the AjaxController is called. So create the Controller
php artisan make:controller AjaxController
，然后在 app/Http/Controllers/AjaxController.php 中添加包含以下行的函数 post :
and in the app/Http/Controllers/AjaxController.php add the function post containing the following lines:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class AjaxController extends Controller {
public function post(Request $request){
$response = array(
'status' => 'success',
'msg' => $request->message,
);
return response()->json($response);
}
}
该函数已准备就绪，可以通过Http请求接收数据，并返回json格式的响应(由状态成功"和该函数从该请求获得的消息组成).
The function is ready to receive data via a Http request and returns a json-formatted response (which consists of the status 'success' and the message the function got from the request).
第一步，我们定义了指向视图 ajax 的路由，因此现在创建视图 ajax.blade.php .
In the first step we defined the route pointing to the view ajax, so now create the view ajax.blade.php.
<!DOCTYPE html>
<html>
<head>
<!-- load jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- provide the csrf token -->
<meta name="csrf-token" content="{{ csrf_token() }}" />
<script>
$(document).ready(function(){
var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
$(".postbutton").click(function(){
$.ajax({
/* the route pointing to the post function */
url: '/postajax',
type: 'POST',
/* send the csrf-token and the input to the controller */
data: {_token: CSRF_TOKEN, message:$(".getinfo").val()},
dataType: 'JSON',
/* remind that 'data' is the response of the AjaxController */
success: function (data) {
$(".writeinfo").append(data.msg);
}
});
});
});
</script>
</head>
<body>
<input class="getinfo"></input>
<button class="postbutton">Post via ajax!</button>
<div class="writeinfo"></div>
</body>
</html>
如果您想知道此csrf令牌有什么问题，请阅读 https://laravel.com/docs /5.3/csrf
If you wonder what's the matter with this csrf-token, read https://laravel.com/docs/5.3/csrf
这篇关于Laravel 5.3中ajax POST的最小工作示例的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
