我的 Laravel 8 应用程序中出现此路由相关错误的原因是什么？

Question

我正在开发一个需要用户注册和登录的 Laravel 应用程序。

更改注册，用户可以用他们选择的图片替换默认头像图片

他们也应该能够删除此图片并恢复为默认头像 (default.png)。为此，我做了以下工作：

在routes/web.php我有必要的路线：

Auth::routes();

Route::get('/dashboard', [App\Http\Controllers\Dashboard\DashboardController::class, 'index'])->name('dashboard');

Route::get('/dashboard/profile', [App\Http\Controllers\Dashboard\UserProfileController::class, 'index'])->name('profile');

Route::post('/dashboard/profile/update', [App\Http\Controllers\Dashboard\UserProfileController::class, 'update'])->name('profile.update');

Route::post('/dashboard/profile/deleteavatar', [App\Http\Controllers\Dashboard\UserProfileController::class, 'deleteavatar'])->name('profile.deleteavatar');

在Controllers\Dashboard\UserProfileController.php我有：

// Delete avatar
public function deleteavatar($id) {
    $current_user = Auth::user();

    if ($id == $current_user->avatar) {
        $current_user->avatar = "default.png";
        $current_user->update();
    }
}

在视图中我有这个删除按钮：

<a href="#" class="icon text-light" id="delete-avatar" data-uid="{{$current_user->id}}"><i class="fa fa-trash"></i></a>

方法通过AJAX执行：

(function() {
  //Delete Avatar
  $('#delete-avatar').on('click', function(evt){
    evt.preventDefault();
    var $avatar = $('#avatar-container').find('img');
    var $topAvatar = $('#top_avatar');
    var $trashIcon = $('#delete-avatar');
    var defaultAvatar = APP_URL + '/images/avatars/default.png';

    //Get user's ID
    var id = $(this).data('uid');

    if(confirm('Delete the avatar?')) {
      $.ajax({
        url: APP_URL + '/dashboard/profile/deleteavatar/' + id,
        method: 'GET',
        dataType: 'html',
        success: function(){
          $avatar.attr('src', defaultAvatar);
          $topAvatar.attr('src', defaultAvatar);
          $trashIcon.remove();
        }
      });
    }
  });
})();

问题

由于我无法弄清楚的原因，每当我单击删除按钮时，我都会在浏览器中收到此错误：

http://larablog.com/dashboard/profile/deleteavatar/1 404 (Not Found)

我做错了什么？

Answer 1

您已将路线定义为 post 方法

Route::post('/dashboard/profile/deleteavatar', [App\Http\Controllers\Dashboard\UserProfileController::class, 'deleteavatar'])->name('profile.deleteavatar');

在ajax你路过

     if(confirm('Delete the avatar?')) {
 var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
          $.ajax({
            url: APP_URL + '/dashboard/profile/deleteavatar/' + id,
            method: 'POST',
            data:{
    id:id,
_token: CSRF_TOKEN,
    }
            success: function(){
              $avatar.attr('src', defaultAvatar);
              $topAvatar.attr('src', defaultAvatar);
              $trashIcon.remove();
            }
          });
        }

已更新

我看到你的代码，你正试图删除登录的用户头像。所以

public function deleteavatar() {

        $current_user = Auth::user();

        $current_user->avatar = "default.png";
        $current_user->save();
    
}

更改路线为

Route::get('/dashboard/profile/deleteavatar', [App\Http\Controllers\Dashboard\UserProfileController::class, 'deleteavatar'])->name('profile.deleteavatar');

在Ajax

(function() {
  //Delete Avatar
  $('#delete-avatar').on('click', function(evt){
    evt.preventDefault();
    var $avatar = $('#avatar-container').find('img');
    var $topAvatar = $('#top_avatar');
    var $trashIcon = $('#delete-avatar');
    var defaultAvatar = APP_URL + '/images/avatars/default.png';

    //Get user's ID
    var id = $(this).data('uid');

    if(confirm('Delete the avatar?')) {
      $.ajax({
        url: APP_URL + '/dashboard/profile/deleteavatar/',
        method: 'GET',
        dataType: 'html',
        success: function(){
          $avatar.attr('src', defaultAvatar);
          $topAvatar.attr('src', defaultAvatar);
          $trashIcon.remove();
        }
      });
    }
  });
})();

Answer 2

必须是：

获取（如 ajax）

Route::post('/dashboard/profile/deleteavatar/{id}', [App\Http\Controllers\Dashboard\UserProfileController::class, 'deleteavatar'])->name('profile.deleteavatar');

和

$.ajax({
        url: APP_URL + '/dashboard/profile/deleteavatar/' + id,
        method: 'POST',
        dataType: 'html',
        success: function(){
          $avatar.attr('src', defaultAvatar);
          $topAvatar.attr('src', defaultAvatar);
          $trashIcon.remove();
        }
});

POST（如路线）

Route::get('/dashboard/profile/deleteavatar/{id}', [App\Http\Controllers\Dashboard\UserProfileController::class, 'deleteavatar'])->name('profile.deleteavatar');

和

$.ajax({
        url: APP_URL + '/dashboard/profile/deleteavatar/' + id,
        method: 'GET',
        dataType: 'html',
        success: function(){
          $avatar.attr('src', defaultAvatar);
          $topAvatar.attr('src', defaultAvatar);
          $trashIcon.remove();
        }
});

删除（RESTful）

Route::delete('/dashboard/profile/deleteavatar/{id}', [App\Http\Controllers\Dashboard\UserProfileController::class, 'deleteavatar'])->name('profile.deleteavatar');

和

$.ajax({
        url: APP_URL + '/dashboard/profile/deleteavatar/' + id,
        method: 'DELETE',
        dataType: 'html',
        success: function(){
          $avatar.attr('src', defaultAvatar);
          $topAvatar.attr('src', defaultAvatar);
          $trashIcon.remove();
        }
});

Answer 3

这是我得到的最终版本：

在routes\web.php中：

Route::post('/dashboard/profile/deleteavatar/{id}', [App\Http\Controllers\Dashboard\UserProfileController::class, 'deleteavatar'])->name('profile.deleteavatar');

在控制器中：

// Delete avatar
public function deleteavatar($id) {
    $current_user = Auth::user();
    $current_user->avatar = "default.png";
    $current_user->save();
}

在app.js中：

(function() {
    //Delete Avatar
    $('#delete-avatar').on('click', function(evt) {
        evt.preventDefault();
        var $avatar = $('#avatar-container').find('img');
        var $topAvatar = $('#top_avatar');
        var $trashIcon = $(this);
        var defaultAvatar = APP_URL + '/images/avatars/default.png';

        //Get user's ID
        var id = $(this).data('uid');

        if (confirm('Delete the avatar?')) {
            var CSRF_TOKEN = $('meta[name="csrf-token"]').attr('content');
            $.ajax({
                url: APP_URL + '/dashboard/profile/deleteavatar/' + id,
                method: 'POST',
                data: {
                    id: id,
                    _token: CSRF_TOKEN,
                },
                success: function() {
                    $avatar.attr('src', defaultAvatar);
                    $topAvatar.attr('src', defaultAvatar);
                    $trashIcon.remove();
                }
            });
        }
    });
})();

有效。

非常感谢所有的帮助。

我的 Laravel 8 应用程序中出现此路由相关错误的原因是什么？

What is the cause of this route-related error in my Laravel 8 application?

php

laravel

laravel-routing

laravel-8

问题