TokenMismatchException 在使用 ajax 在 laravel 上的 VerifyCsrfToken.php 第 67 行

Posted 2023-02-24

【中文标题】TokenMismatchException 在使用 ajax 在 laravel 上的 VerifyCsrfToken.php 第 67 行

【英文标题】：TokenMismatchException in VerifyCsrfToken.php line 67 on laravel using ajax

【发布时间】：2016-10-06 09:58:31

【问题描述】：

此视图有一个调用 javascript 函数的链接

@extends('layouts.main')

@section('content')
    <table class="table">
        <tr>
            <th>ID</th>
            <th>Nombre</th>
            <th>Opción</th>
        </tr>
    @foreach ($tasks as $task)
        <tr>
          <td>$task->id</td>
            <td>$task->name</td>
            <td><a href="javascript:void(0)" onclick="eliminar($task->id)" class="btn btn-danger">Eliminar</a></td>
        </tr>
    @endforeach
    </table>
@stop

这里是javascript代码

function eliminar(id)
  $.ajax(

           type: "DELETE",
           url: "task/"+id,
           success: function (data) 
               console.log(data);
           ,
           error: function (data) 
               alert('Error:', data);
           
    );

通过 ajax 调用，我想调用我的控制器的 destroy 方法

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use App\Http\Requests;
use App\Task;

class TaskController extends Controller

    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    
        $tasks = Task::all();
        return view('mainview',['tasks' => $tasks]);
    

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    
        //
    

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    
        //
    

    /**
     * Display the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function show($id)
    
        //
    

    /**
     * Show the form for editing the specified resource.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function edit($id)
    
        //
    

    /**
     * Update the specified resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function update(Request $request, $id)
    
        //
    

    /**
     * Remove the specified resource from storage.
     *
     * @param  int  $id
     * @return \Illuminate\Http\Response
     */
    public function destroy($id)
    
        return "destroy";
    

但是当我点击链接时，我得到了这个错误：

VerifyCsrfToken.php 第 67 行中的 TokenMismatchException

我是 Laravel 的新手，但我认为 csrf 是用于表单的。

【参考方案1】：

您应该将csrf_field 添加到您的主刀片：

 csrf_field() 

然后将_token 添加到您的请求中：

var _token = $('input[name="_token"]').val();

function eliminar(id)
  $.ajax(
    type: "DELETE",
    url: "task/"+id,
    data:  _token : _token ,
    success: function (data) 
      console.log(data);
    ,
    error: function (data) 
      alert('Error:', data);
    
  );

或者您可以在ajaxSetup 中添加一次，它会影响对$.ajax 或基于Ajax 的派生类（例如$.get()）的所有调用：

$.ajaxSetup(

    headers:
    
        'X-CSRF-Token': $('input[name="_token"]').val()
    
);

看看CSRF Protection。

希望这会有所帮助。

【参考方案2】：

这对我有用。我在网上找到了几个答案，但没有一个单独起作用；然而，在结合所有之后，我得到了 Ajax 调用。

在视图文件的头部，添加以下行：

<meta name="csrf-token" content="<?php echo csrf_token() ?>"> // This will retrieve the necessary token.

然后，检索令牌的值并将其放在变量上（可选步骤）：

var currentToken = $('meta[name="csrf-token"]').attr('content');

在您的 ajax 调用中，将令牌的值包含在“数据：”字段中：

$.ajax(type: 'POST', data: _token:currentToken,....);

您可以避免在“数据：”字段上为其创建新变量的可选步骤；但是，我发现这一步更容易理解。

希望这会有所帮助。

【参考方案3】：

您需要在传递“DELETE”方法时添加令牌输入字段。

html：

<input class="token" value=" csrf_field() "/>

代码：

function eliminar(id)
  var formData = '_token=' + $('.token').val();
  $.ajax(
           type: "DELETE",
           url: "task/"+id,
           data: formData,
           success: function (data) 
               console.log(data);
           ,
           error: function (data) 
               alert('Error:', data);
           
    );

您还可以将该路由从验证过程中删除，方法是将其添加到中间件中的 except 数组中。