1.本來我是一個后端程序員但是耐不住對技術的追求與好奇所以實驗了一下這里分享一下經驗
1.1上前端靜態資源模板（在laravel中標記的地方不要忘記了）
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Ajax-提交form表單實驗</title> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"> </script> </head> <body> <form action="" id="info"> @csrf Username:<input type="text"name="username"><br> Password: <input type="password" name="password"><br> <button type="button" onclick="btn()" > 提交</button> </form> </body> <script> function btn() { $.ajax({ type:'POST',//提交類型 dataType:'json',//數據形式 url:"{{url('test')}}",//提交的url data:$("#info").serialize(),//序列化為可以傳輸的數據 success:function (res) {//如果成功返回的信息res console.log(res) }, }) } </script> </html>
2.控制器代碼
public function index(Request $request){
$data=User::create($request->except('_token'));//向數據庫中添加除卻_token之外的數據
if ($data){
$info=['status'=>1,'message'=>'添加成功'];
}else{
$info=['status'=>0,'message'=>'添加失敗'];
}
return $info;//返回信息：這里laravel框架會自動返回為json數據
}
4.資源
4.1數據庫代碼ddl
CREATE TABLE `user` ( `id` int(5) NOT NULL AUTO_INCREMENT, `username` varchar(15) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL, `password` varchar(999) CHARACTER SET utf8mb4 COLLATE utf8mb4_0900_ai_ci DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=80 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci;
4.2對應數據庫的model文件
<?php namespace App\Models; use Illuminate\Database\Eloquent\Model; class User extends Model { // public $table='user'; protected $fillable=['username','password']; public $timestamps=false; }
5.最終可以實現對數據表的插入
6.這里補充代碼提交的時候token的問題：
1.第二種在Ajax中to添加ken的方法
1.1在頭部實用meta標簽外加在Ajax中實用內定的方法
一旦你創建了 meta 標簽，就可以指示像 jQuery 這樣的庫自動將令牌添加到所有請求的頭信息中。還可以為基於 AJAX 的應用提供簡單，方便的 CSRF 保護
<meta name="csrf-token" content="{{ csrf_token() }}">
1.2接着在ajax提交中使用：
headers: {'X-CSRF-TOKEN': $('meta[name="csrftoken"]').attr('content') }
2:接着你就可以正常的提交代碼了：在laravel中除卻get請求所有的請求都需要token驗證