現在の位置: ホーム> 最新記事一覧> Laravel Ueditor Integrationチュートリアル| LaravelでUeditorエディターを使用する方法

Laravel Ueditor Integrationチュートリアル| LaravelでUeditorエディターを使用する方法

gitbox 2025-07-29

laravel ueditorとは何ですか

Laravel Ueditorは、Laravelフレームワークでの開発者の統合の取り組みを簡素化するために設計された強力なコンテンツエディターです。 Imageのアップロードやファイル管理などのさまざまな形式のコンテンツ編集機能を含む、直感的なリッチテキスト編集機能をWebアプリケーションに提供します。 Laravel Ueditorを使用すると、開発者はユーザーエクスペリエンスを改善し、コンテンツ管理の効率を向上させることができます。

Laravel Ueditorをインストールします

ueditorをLaravelプロジェクトに統合すると、最初にComposerを介して依存関係をインストールする必要があります。プロジェクトのルートディレクトリで次のコマンドを実行してください。

 composer require "baijunyao/laravel-ueditor"

インストールが完了したら、config/app.phpファイルにサービスプロバイダーを登録する必要があります。

 Baijunyao\Ueditor\UeditorServiceProvider::class,

Laravel Ueditorの構成

サービスプロバイダーをインストールして登録した後、ニーズに応じて構成ファイルを公開する必要があります。次のコマンドを使用して、構成ファイルを公開します。

 php artisan vendor:publish --provider="Baijunyao\Ueditor\UeditorServiceProvider"

このコマンドは、configuration file config/ueditor.phpを作成します。ここでは、アップロードパス、ファイルサイズ制限など、ueditor構成オプションをカスタマイズできます。

アップロードパスをセットアップします

config/ueditor.phpファイルで、ファイルへのアップロードパスを設定できます。たとえば、次の方法でパスを保存するようにファイルを構成できます。

 'pathFormat' => '/uploads/ueditor/'.date('Ymd').'/',

ビューでlaravel ueditorを使用します

LaravelのビューでUeditorを使用して、JavaScriptファイルをロードしてUEDITORエディターコンポーネントを挿入するだけです。まず、ビューファイルにueditorのJavaScriptファイルをロードします。

 <script type="text/javascript" src="{{ asset('vendor/ueditor/ueditor.all.min.js') }}"></script>

次に、ueditorエディターをフォームに追加できます。

 var ue = UE.getEditor('editor');
 <textarea id="editor" name="content"></textarea>

フォームとデータ処理を送信します

ユーザーがフォームを送信すると、コントローラーでエディター生成コンテンツを処理できます。次のコードを使用してコンテンツを取得し、データベースに保存します。

 $content = request()->input('content');
 Post::create([ 'content' => $content ]);

要約します

Laravel Ueditorは、非常に統合された強力なテキストエディターであり、特に開発者がLaravelアプリケーションで使用するのに適しています。上記のチュートリアルを通じて、インストール、構成、使用を簡単に完了して、プロジェクトコンテンツ管理の効率を向上させることができます。正しい構成と使用により、ユーザーエクスペリエンスが大幅に向上します。