在Laravel中使用TinyMCE CDN时，上传图片的存储位置是哪里？

你当前的代码并没有将图片上传到Laravel服务器，而是把图片转成Base64编码后存在浏览器内存的TinyMCE Blob缓存里。

代码逻辑拆解 #

这段file_picker_callback的处理流程是：

• 通过创建本地文件选择框获取图片文件
• 用FileReader把图片转成Base64编码字符串
• 将Base64数据存入TinyMCE的blobCache，生成浏览器本地的Blob URL（格式类似blob:http://your-domain/xxx）
• 把这个本地URL传给编辑器显示图片

此时图片仅临时存放在浏览器内存中，页面刷新或关闭后就会丢失。如果提交编辑器内容，Base64编码的图片会直接嵌入到HTML内容里（比如<img src="data:image/png;base64,...">），随表单一起提交到后端，但不会自动存储到Laravel的服务器目录。

若要将图片存储到Laravel服务器 #

需要修改上传逻辑，通过AJAX把文件发送到Laravel的上传接口，步骤如下：

1. 在Laravel中创建上传路由和控制器方法，处理文件上传并返回图片访问URL
2. 修改file_picker_callback，替换本地缓存逻辑为后端上传请求

修改后的前端代码示例

file_picker_types: 'file image media',
file_picker_callback: function (cb, value, meta) {
    var input = document.createElement('input');
    input.setAttribute('type', 'file');
    input.setAttribute('accept', 'image/*,audio/*,video/*');

    input.onchange = function () {
        var file = this.files[0];
        var formData = new FormData();
        formData.append('image', file);

        // 发送请求到Laravel上传接口
        fetch('/upload-image', {
            method: 'POST',
            headers: {
                'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content
            },
            body: formData
        }).then(response => response.json())
          .then(data => {
              // 将后端返回的图片URL传给编辑器
              cb(data.url, { title: file.name });
          });
    };

    input.click();
},

Laravel后端控制器示例

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

public function uploadImage(Request $request)
{
    $request->validate([
        'image' => 'required|image|max:2048', // 限制图片类型和大小（2MB）
    ]);

    // 存储到storage/app/public/images目录
    $path = $request->file('image')->store('public/images');
    // 生成可访问的URL
    $url = Storage::url($path);

    return response()->json(['url' => $url]);
}

内容的提问来源于stack exchange，提问作者Chithira Kumar M