JavaScriptとAjaxがlaravelで動作しない5.2

Question

カテゴリページがあります。カテゴリを作成ボタンをクリックすると、新しいカテゴリが追加されます。しかし、送信ボタンをクリックしても何も起こらず、エラーメッセージも表示されません。どこに問題がありますか？助けてください

マイカテゴリーブレードテンプレートがある

@extends('layouts.admin-master') 


@section('styles') 
    <link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"> 
    {!! Html::style('src/css/categories.css') !!} 
@endsection 

@section('content') 
    <div class="container"> 
     <section id="category-admin"> 

      <form action="" method="post"> 
       <div class="input-group"> 
        <label for="Category">Category Name</label> 
        <input type="text" name="name" id="name"> 
        <button type="submit" class="btn">Create Category</button> 
       </div> 
      </form> 

     </section> 
     <section class="list"> 
      @foreach($categories as $category) 
       <article> 
        <div class="category-info" data-id="{{ $category->id }}"> 
         <h3>{{ $category->name }}</h3> 
        </div> 

        <div class="edit"> 
         <nav> 
          <ul> 
           <li class="category-edit"><input type="text" name=""></li> 
           <li><a href="#">Edit</a></li> 
           <li><a href="#" class="danger">Delete</a></li> 
          </ul> 
         </nav> 

        </div> 
       </article> 
      @endforeach 
     </section> 

     @if($categories->lastPage() > 1) 
      <section class="pagination"> 
       @if($categories->currentPage() !== 1) 
        <a href="{{ $categories->previousPageUrl() }}"><i class="fa fa-caret-left"></i></a> 
       @endif 

       @if($categories->currentPage() !== $categories->lastPage()) 
        <a href="{{ $categories->nextPageUrl() }}"><i class="fa fa-caret-right"></i></a> 
       @endif 
      </section> 
     @endif 
    </div> 

@endsection 

@section('scripts') 
    <script type="text/javascript"> 
     var token = "{{ Session::token() }}"; 
    </script> 
    {!! Html::script('src/js/categories.js') !!} 
@endsection 

マイcategories.jsファイルがある

var docReady = setInterval(function() { 
    if(document.readyState !== "complete") { 
     return; 
    } 
    clearInterval(docReady); 

    document.getElementsByClassName('btn')[0].addEventListener('click',createNewCategory); 
}, 100); 

function createNewCategory(event) { 
    event.preventDefault(); 
    var name = event.target.previousElementsSibling.value; 
    if(name.length === 0) { 
     alert("Please create A valid Category"); 
     return; 

    } 
    ajax("POST", "/admin/blog/category/create", "name=" + name, newCategoryCreated, [name]); 

} 

function newCategoryCreated(params, success, responseObj) { 
    location.reload(); 
} 

function ajax(method, url, params, callback, callbackParams) { 
    var http; 

    if(window.XMLHttpRequest) { 
     http = new XMLHttpRequest(); 
    } else { 
     http = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 


    http.onreadystatechange = function() { 
     if (http.readyState == XMLHttpRequest.DONE) { 
      if (http.status == 200) { 
       var obj = JSON.parse(http.responseText); 
       callback(callbackParams, true, obj); 
      } else if (http.status == 400) { 
       alert("Category could not be saved. Please Try Again"); 
       callback(callbackParams, false); 
      } else { 
       var obj = JSON.parse(http.responseText); 
       if (obj.message) { 
        alert(obj.message); 
       } else { 
        alert("please Check the name"); 
       } 
      } 
     } 
    } 
    http.open(method, baseUrl + url, true); 
    http.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 

    http.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); 
    http.send(params + "&_token=" + token); 
} 

私のルート・ファイルが

Route::get('/blog/categories', [ 
        'uses' => 'CategoryController@getCategoryIndex', 
        'as' => 'admin.blog.categories' 
      ]); 
Route::post('/blog/category/create', [ 
        'uses' => 'CategoryController@postCreateCategory', 
        'as' => 'admin.blog.category.create' 
      ]); 

ですそして、私のカテゴリーコントローラは

です

<?php 

namespace App\Http\Controllers; 

use Illuminate\Http\Request; 

use App\Http\Requests; 

use App\Category; 

use Illuminate\Support\Facades\Response; 

class CategoryController extends Controller 
{ 
    public function getCategoryIndex() { 
     $categories = Category::orderBy('created_at','desc')->paginate(5); 

     return view('admin.blog.categories',['categories' => $categories]); 
    } 

    public function postCreateCategory(Request $request) { 
     $this->validate($request, [ 
      'name' => 'required|unique:categories' 
      ]); 

     $category = new Category(); 
     $category->name = $request['name']; 
     if($category->save()) { 
      return Response::json(['message' => 'Category Created'], 200); 
     } 
     return Response::json(['message' => 'Error during Creation'], 404); 
    } 
} 

Answer 1

トークンをヘッダーまたはサーバーのパラメーターとして送信します。ここでの詳細情報：

https://laravel.com/docs/5.2/routing#csrf-protection