So laden Sie Bilder mit CKeditor im Laravel-Tutorial hoch

Dieses Tutorial zeigt, wie Sie mit CKEditor die Bild-Upload-Funktion in Laravel 11 implementieren.

CKEditor ist ein webbasierter Open-Source-WYSIWYG-Editor, mit dem Benutzer Textinhalte im Browser bearbeiten können. Es handelt sich um ein leistungsstarkes Tool, mit dem Benutzer ohne Programmierkenntnisse Text erstellen und formatieren, Bilder und Multimedia hinzufügen und HTML-Code bearbeiten können. CKEditor wurde 2003 erstmals veröffentlicht und hat sich aufgrund seiner Vielseitigkeit und Benutzerfreundlichkeit zu einer beliebten Wahl bei Webentwicklern und Inhaltserstellern entwickelt. Es ist in JavaScript geschrieben und lässt sich problemlos in jede Webanwendung integrieren.

In diesem Beispiel erstellen wir eine einfache CKEditor-Instanz mit einer Bild-Upload-Option, die das Bild im lokalen Speicher speichert. Wir werden zwei Routen einrichten, eine für GET-Anfragen und eine für POST-Anfragen (für Bild-Uploads). Nachdem der Benutzer ein Bild ausgewählt und übermittelt hat, wird das Bild im Ordner „media“ gespeichert. Sie können sich auch Beispiele für die Laravel 11 CORS-Middleware-Konfiguration ansehen.

Beispiel für die Verwendung von CKEditor zum Hochladen von Bildern in Laravel 11

Schritt 1: Laravel 11 installieren

Zuerst müssen wir mit dem folgenden Befehl eine neue Laravel 11-Versionsanwendung erhalten, da wir bei Null anfangen. Öffnen Sie also Ihr Terminal oder Ihre Eingabeaufforderung und führen Sie den folgenden Befehl aus:

composer create-project laravel/laravel example-app

Schritt 2: Erstellen Sie eine Route

In diesem Schritt fügen wir drei Routen mit GET- und POST-Methoden in der routes/web.php-Datei hinzu. Fügen wir es hinzu.

routes/web.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');
?>

Schritt 3: Controller erstellen

In diesem Schritt müssen wir einen neuen Controller mit dem Namen CkeditorController erstellen, der die Methoden index() und update() enthält.

Bitte stellen Sie sicher, dass Sie den Ordner public in Ihrem Verzeichnis media erstellt haben, da die Bilder in diesem Ordner gespeichert werden. Erfahren Sie mehr...

Das obige ist der detaillierte Inhalt vonSo laden Sie Bilder mit CKeditor im Laravel-Tutorial hoch. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!