Javascript 使用vue wysiwyg上传图像时的问题

我正在我的laravel vue应用程序中使用。在这个编辑器中有一个选项来上传图像，通过这个包的不完整文档，我可以上传图像并获得上传文件的公共url。但这个软件包有时有效，有时根本不起作用

下面是我如何使用这个软件包

main.js

import wysiwyg from "vue-wysiwyg";

Vue.use(wysiwyg, {
    forcePlainTextOnPaste: true,
    image: {
        uploadURL: "/api/save-support-files",
        dropzoneOptions: {}
    },
});

public function uploadUserFile(Request $request)
    {
        $uploadedFile = $request->file('file');


        if (false == $uploadedFile) {
            return response()->api(false, 'Kindly upload a file');
        }

        $allowed_file_extentions = [
            'jpeg',
            'png',
            'jpg',
            'gif',
            'svg'
        ];

        if (false == in_array($uploadedFile->getClientOriginalExtension(), $allowed_file_extentions)) {
            return response()->api(false,'Allowed file types are jpeg, png, jpg, gif, svg',null);
        }


        $file_url = Storage::disk('public')->putFileAs('/support-files',$uploadedFile,generateRandomString('5').'.'.$uploadedFile->getClientOriginalExtension());

//        return response()->api(true,'File uploaded successfully',config('app.url').'/storage/'.$file_url);

        return config('app.url').'/storage/'.$file_url;
}

/api/保存支持文件

import wysiwyg from "vue-wysiwyg";

Vue.use(wysiwyg, {
    forcePlainTextOnPaste: true,
    image: {
        uploadURL: "/api/save-support-files",
        dropzoneOptions: {}
    },
});

public function uploadUserFile(Request $request)
    {
        $uploadedFile = $request->file('file');


        if (false == $uploadedFile) {
            return response()->api(false, 'Kindly upload a file');
        }

        $allowed_file_extentions = [
            'jpeg',
            'png',
            'jpg',
            'gif',
            'svg'
        ];

        if (false == in_array($uploadedFile->getClientOriginalExtension(), $allowed_file_extentions)) {
            return response()->api(false,'Allowed file types are jpeg, png, jpg, gif, svg',null);
        }


        $file_url = Storage::disk('public')->putFileAs('/support-files',$uploadedFile,generateRandomString('5').'.'.$uploadedFile->getClientOriginalExtension());

//        return response()->api(true,'File uploaded successfully',config('app.url').'/storage/'.$file_url);

        return config('app.url').'/storage/'.$file_url;
}

我现在面临的问题是：

当我从文件浏览器中选择图像时，图像通过api成功上传，但它并没有显示在编辑器中

无法选择已上载的图像，我必须刷新页面，然后再次选择文件以再次上载

---

有人能解决这个问题吗？请帮助我。

我的上传存储功能如下所示：

public function store(Request $request)
{
    $request->validate(['file' => 'required']);

    $file = $request->file('file');
    if ($file->isValid()) {
        $path = $file->storePublicly(now()->format('Y' . DIRECTORY_SEPARATOR . 'm' . DIRECTORY_SEPARATOR . 'd'));

        return response(Storage::disk('public')->url($path), Response::HTTP_CREATED)->withHeaders(
            [
                'content-type' => 'text/html'
            ]
        );
    }

    abort(Response::HTTP_BAD_REQUEST);
}

确保已将

.env

中的

应用程序URL

设置为完整URL（）

确保运行

php artisan存储：link