как и в отличие от javascript и Laravel

Question

Я пытаюсь реализовать функциональность, в которой пользователю может понравиться продукт, в отличие от продукта, с помощью javascript. Я следовал этой кнопке Laravel - Favorite / Un-Favorite , но она не работает для меня, кнопка может 'Если вы не нажали, есть идеи, как я могу это исправить?

Маршруты

Route::get('product/like/{id}', ['as' => 'product.like', 'uses' =>   'LikeController@likeProduct']);
Route::get('product/{product}/unlike','LikeController@destroy')->name('product.unlike');

Javascript

 <script>

function addToFavourites(productid, userid) {
var user_id = userid;
var product_id = productid;

$.ajax({
    type: 'post',
    url: 'product/like/{id}',
    data: {
        'user_id': user_id,
        'product_id': product_id,
    },
    success: function () {
        // hide add button
        $('#addfavourites' + product_id).hide();
        // show delete button
        $('#deletefavourite' + product_id).show();
    },
    error: function (XMLHttpRequest) {
        // handle error
    }
});
}

Блейд-файл

   @if($product->isLiked)
      <div id="addfavourites{{$product->id}}" onClick="addToFavourites({{$product->id}}, {{ Auth::user()->id }})"> unlike </div>
       @else
       <div id="deletefavourite{{$product->id}}" onClick="deleteFromFavourites({{$product->id}}, {{ Auth::user()->id }})" > like </div>
    @endif

Answer 1

Сделайте так, чтобы ваши маршруты принимали метод post, потому что вы отправляете через Ajax

Route::post('product/like/{id}', ['as' => 'product.like', 'uses' => 'LikeController@likeProduct']);
Route::post('product/{product}/unlike', 'LikeController@destroy')->name('product.unlike');

И используете строку шаблона ES6 и добавляете заголовок токена CSRF в запрос Ajax

function addToFavourites(productid, userid) {
    // Redundant
    // var user_id = userid;
    // var product_id = productid;
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $.ajax({
        method: 'post',
        url: `/product/like/${productid}`, // Use ES6 template and point to the url from root /
        data: {
            'user_id': userid,
            'product_id': productid,
        },
        success: function () {
            // hide add button
            $('#addfavourites' + productid).hide();
            // show delete button
            $('#deletefavourite' + productid).show();
        },
        error: function (XMLHttpRequest) {
            // handle error
        }
    });
}

Надеюсь, это поможет