如何在 Laravel 教程中使用 CKeditor 上传图片

本教程演示如何在 Laravel 11 中使用 CKEditor 实现图片上传功能。

CKEditor 是一款基于 Web 的开源所见即所得 (WYSIWYG) 编辑器，允许用户在浏览器中编辑文本内容。它是一个强大的工具，使用户能够创建和格式化文本、添加图像和多媒体以及编辑 HTML 代码，无需任何编码知识。CKEditor 于 2003 年首次发布，由于其多功能性和易用性，已成为 Web 开发人员和内容创建者的热门选择。它使用 JavaScript 编写，可以轻松集成到任何 Web 应用程序中。

在本例中，我们将创建一个简单的 CKEditor 实例，该实例具有一个图片上传选项，该选项将图片保存到本地存储。我们将设置两条路由，一条用于 GET 请求，另一条用于 POST 请求（用于图片上传）。用户选择图片并提交后，图片将存储在“media”文件夹中。您还可以学习 Laravel 11 CORS 中间件配置示例。

Laravel 11 中使用 CKEditor 上传图片的示例

步骤 1：安装 Laravel 11

首先，我们需要使用以下命令获取一个新的 Laravel 11 版本应用程序，因为我们是从头开始的。因此，打开您的终端或命令提示符并运行以下命令：

<code class="language-bash">composer create-project laravel/laravel example-app</code>

步骤 2：创建路由

在此步骤中，我们将在 routes/web.php 文件中添加三个具有 GET 和 POST 方法的路由。让我们添加它。

routes/web.php

<code class="language-php"><?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\CkeditorController;

Route::get('ckeditor', [CkeditorController::class, 'index']);
Route::post('ckeditor/upload', [CkeditorController::class, 'upload'])->name('ckeditor.upload');
?></code>

步骤 3：创建控制器

在此步骤中，我们必须创建一个名为 CkeditorController 的新控制器，其中包含 index() 和 update() 方法。

请确保您已在您的 public 目录中创建了 media 文件夹，因为图片将存储在该文件夹中。了解更多信息...

以上是如何在 Laravel 教程中使用 CKeditor 上传图片的详细内容。更多信息请关注PHP中文网其他相关文章！