Tinymce 5上传视频如何保存到Laravel 8的storage目录下

1. 调整前端TinyMCE配置 #

你当前的配置是直接将视频转为base64地址插入编辑器，没有上传到后端存储，需要修改file_picker_callback逻辑，改为选中视频后先上传到Laravel后端接口，再用后端返回的正式访问地址插入编辑器。
修改后的配置代码如下：

file_picker_types: 'media',
file_picker_callback: function(cb, value, meta) {
    // 只处理媒体类型上传
    if (meta.filetype !== 'media') return;
    const input = document.createElement('input');
    input.setAttribute('type', 'file');
    input.setAttribute('accept', 'video/mp4,video/avi,video/mov'); // 按需调整允许的视频格式
    input.onchange = async function() {
        const file = this.files[0];
        if (!file) return;
        // 构造上传用的FormData
        const formData = new FormData();
        formData.append('video', file);
        try {
            const res = await fetch('/api/upload/tinymce-video', {
                method: 'POST',
                headers: {
                    // 若使用web路由，需携带CSRF令牌，需确保页面head有对应meta标签
                    'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content
                },
                body: formData
            });
            const data = await res.json();
            // 插入后端返回的正式访问地址
            cb(data.url, { title: file.name });
        } catch (err) {
            console.error('上传失败', err);
            alert('视频上传失败，请检查文件大小、格式后重试');
        }
    };
    input.click();
},

2. 实现Laravel后端上传逻辑 #

2.1 新增路由 #

在routes/api.php中添加上传路由（如果用web路由就加在routes/web.php）：

use App\Http\Controllers\UploadController;

Route::post('/upload/tinymce-video', [UploadController::class, 'tinymceVideo']);

2.2 新增上传控制器 #

创建app/Http/Controllers/UploadController.php，代码如下：

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Storage;

class UploadController extends Controller
{
    public function tinymceVideo(Request $request)
    {
        // 校验上传参数
        $request->validate([
            'video' => 'required|file|mimes:mp4,avi,mov|max:102400' // max单位为KB，102400对应100M，可按需调整
        ]);

        // 存储视频到public磁盘的videos目录，自动生成唯一文件名避免重名
        $savePath = $request->file('video')->store('videos', 'public');

        // 返回符合要求的访问地址，格式为 /storage/视频路径
        return response()->json([
            'url' => Storage::url($savePath)
        ]);
    }
}

3. 配置存储访问 #

执行以下命令创建软链接，让public目录下的storage指向实际存储文件的storage/app/public目录，前端才能正常访问视频：

php artisan storage:link

注意事项 #

• 若需要自定义视频保存的文件名，可将store方法替换为storeAs，自行拼接文件名。
• 需匹配PHP配置中的upload_max_filesize和post_max_size数值，大于你允许上传的最大视频大小，避免大文件上传失败。
• 若需要限制上传权限，可在路由或者控制器中添加对应的权限校验逻辑。

内容的提问来源于stack exchange，提问作者user16463899