I have searched online and the answer for this problem I found is to make sure that I am not using 2 gets or posts with the same name. But I'm not. I am just doing a quick tutorial online on how to use ajax with laravel but I get this error every time I try use post. When I use get it works fine. I would really appreciate it if someone could shed some light on this problem? Thanks.
POST http://ajaxlaravel.app:8000/register 404 (Not Found)
Here is my welcome.blade file:
<!DOCTYPE html>
<html>
<head>
<title>Laravel</title>
<meta name="csrf-token" content="{{ csrf_token() }}" />>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"/>
</head>
<body>
<div class="container">
<h2>Register form</h2>
<div class="row col-lg-5">
<h2>Get Request</h2>
<button type="button" class="btn btn-warning" id="getRequest">getRequest</button>
</div>
<div class="row col-lg-5">
<h2>Request Form</h2>
<form id="register" action="#">
{{ csrf_field() }}
<label for="firstname">
Firstname: <input type="text" id="firstname" class="form-control" placeholder="John"/>
</label><br>
<label for="lastname">
Lastname: <input type="text" id="lastname" class="form-control" placeholder="Smith"/>
</label><br><br>
<input type="submit" value="Register" class="btn btn-primary">
</form>
</div>
</div>
<div id="getRequestData"></div>
<div id="postRequestData"></div>
<script type="text/javascript" src="{{asset('js/jquery.js')}}"></script>
<script type="text/javascript">
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
$(document).ready(function(){
$('#getRequest').click(function(){
$.get('getRequest', function(data){
$('#getRequestData').append(data);
console.log(data);
});
});
$('#register').submit(function(){
var fname = $('#firstname').val();
var lname = $('#lastname').val();
$.post('register', {firstname:fname, lastname:lname}, function(data){ //Take data from form register and post it but give a call back function using data.
console.log(data);
$('#postRequestData').html(data);
});
});
});
</script>
</body>
</html>
And my routes:
Route::group(['middleware' => ['web']], function () {
Route::get('/', 'WelcomeController@index');
Route::get('/getRequest', function(){
if(Request::ajax()){ //Does a check to see if the request is ajax.
return 'getRequest loaded completely';
}
Route::post('/register', function(){
if(Request::ajax()){
return Response::json(Request::all());
}
});
});
});
And my WelcomeController:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Http\Requests;
class WelcomeController extends Controller
{
public function _construct(){
$this->middleware('guest');
}
/*
* Show application review
*
* @return response
*/
public function index(){
return view('welcome');
}
}
And my VerifyCrsffToken.php:
<?php
namespace App\Http\Middleware;
use Illuminate\Foundation\Http\Middleware\VerifyCsrfToken as BaseVerifier;
class VerifyCsrfToken extends BaseVerifier
{
/**
* The URIs that should be excluded from CSRF verification.
*
* @var array
*/
protected $except = [
//
];
/**
* Determine if the session and input CSRF tokens match.
*
* @param \Illuminate\Http\Request $request
* @return bool
*/
protected function tokensMatch($request)
{
// If request is an ajax request, then check to see if token matches token provider in
// the header. This way, we can use CSRF protection in ajax requests also.
$token = $request->ajax() ? $request->header('X-CSRF-Token') : $request- >input('_token');
return $request->session()->token() == $token;
}
}
