Vibe Coding Laravel 使用 ueditor 编辑器

廖圣平2026-04-16 8:25

之前用 dcat-admin 已经很好了，但是现在ai时代，都不需要写代码了。直接一句话就能解决，但是对于这种编辑器，对于ai来说还是有一定的难度的，这边记录下用法。

首先用到库：

其实用不用都无所谓，但是这个同志已经有装好了，就直接拿来用吧，需要改动下。

clike 复制代码

loongws/laravel-ueditor

按照READEME.md 先安装使用。

这边主要记录下上传文件这个配置如何配置。

排除下 csrf

bootstrap/app.php

clike 复制代码

<?php

use Illuminate\Foundation\Application;
use Illuminate\Foundation\Configuration\Exceptions;
use Illuminate\Foundation\Configuration\Middleware;

return Application::configure(basePath: dirname(__DIR__))
    ->withRouting(
        web: __DIR__.'/../routes/web.php',
        commands: __DIR__.'/../routes/console.php',
        health: '/up',
    )
    ->withMiddleware(function (Middleware $middleware): void {
        $middleware->append(\App\Http\Middleware\SeoMiddleware::class);
        $middleware->validateCsrfTokens(
            except: [
                '/admin/u-upload',
            ],
        );
    })
    ->withExceptions(function (Exceptions $exceptions): void {
        //
    })->create();

在

clike 复制代码

public\vendor\ueditor\ueditor.config.js

修改，这边的serverUrl 是图片上传和获取基础数据的地址：

clike 复制代码

    window.UEDITOR_CONFIG = {

        //为编辑器实例添加一个路径，这个不能被注释
        UEDITOR_HOME_URL: URL

        // 服务器统一请求接口路径
        , serverUrl:'/admin/u-upload'

前缀为admin 中添加路由

clike 复制代码

        Route::any('u-upload', function () {
            if (request()->isMethod('get') ){
                return config('ueditor.upload');
            }
            $file = request()->file('upfile');
            if ($file) {
                    // 保存到 public 磁盘（浏览器可访问）
                $path = $file->store('uploads', 'public');

                // 获取完整 URL
                $url = Storage::disk('public')->url($path);
                return response()->json([
                    'state' => 'SUCCESS',
                    'url' => $url,
                    'title' => $file->getClientOriginalName(),
                    'original' => $file->getClientOriginalName(),
                ]);
            }
            return response()->json(['state' => 'ERROR']);
        });