TinyMCE内联拖放图像上载不工作

TinyMCE内联拖放图像上载不工作,tinymce,tinymce-5,Tinymce,Tinymce 5,我已经把一个TinyMCE编辑器的工作实例与拖放图像上传放在一起,如果一个图像被放入TinyMCE编辑器(或粘贴),它将触发一个上传到服务器的图像,并说图像现在将在编辑器中 该功能突然停止工作。我得到的只是一条错误消息:“不支持删除的文件类型” 此外,TinyMCE网站上的该功能示例似乎也不再适用于相同的错误消息 浏览器或TinyMCE代码中是否有更改导致此功能停止工作?即使TinyMCE版本未被触动,如果它突然停止工作,那么它似乎与TinyMCE代码无关 编辑:粘贴似乎有效,粘贴后图像将成功上

我已经把一个TinyMCE编辑器的工作实例与拖放图像上传放在一起,如果一个图像被放入TinyMCE编辑器(或粘贴),它将触发一个上传到服务器的图像,并说图像现在将在编辑器中

该功能突然停止工作。我得到的只是一条错误消息:“不支持删除的文件类型”

此外,TinyMCE网站上的该功能示例似乎也不再适用于相同的错误消息

浏览器或TinyMCE代码中是否有更改导致此功能停止工作?即使TinyMCE版本未被触动,如果它突然停止工作,那么它似乎与TinyMCE代码无关


编辑:粘贴似乎有效,粘贴后图像将成功上载。然而,拖放仍然失败。这是直接拖放到编辑器中,而不是工作正常的上载图像对话框中。

我认为您的问题可能与自TinyMCE 5.4以来存在的
block\u unsupported\u drop
选项有关,请参阅

我注意到了与您相同的问题(
“删除的文件类型不受支持”
通知),并验证了如果我将
block\u unsupported\u drop
设置为
false
(内联模式下的TinyMCE 5.5),则该问题不再存在

这是TinyMCE中的相关代码:


老实说,我不太明白在什么情况下可能需要阻止删除,但看起来该选项是作为修复删除图像后出现错误的浏览器导航()的一部分引入的。如果您了解更多信息,请告诉我。

最终注册了ondrop事件处理程序。 我使用的是
@tinymce/tinymce angular
,但是在使用
编辑器注册时应该是一样的

import { EditorComponent } from "@tinymce/tinymce-angular";

....

@ViewChild(EditorComponent) editor: EditorComponent;

....

ngAfterViewInit() {

    this.editor.onDrop.subscribe(async (e: { editor, event }) => {
        let event = e.event;

        // Preventing 'Dropped file type is not supported' notification pop up
        event.preventDefault();
        event.stopImmediatePropagation();
        event.stopPropagation();

        let files: File[] = [...event.dataTransfer.files];
        let uploadedFiles = await this.uploadFiles(files); // backend call

        uploadedFiles.forEach(file => {
            // change for different file types
            this.insertContent(`<img src="${file.Url}" />`);
        })
    })

}
从“@tinymce/tinymce”导入{EditorComponent}”;
....
@ViewChild(EditorComponent)编辑器:EditorComponent;
....
ngAfterViewInit(){
subscribe(异步(e:{editor,event})=>{
设event=e.event;
//防止弹出“不支持删除的文件类型”通知
event.preventDefault();
事件。stopImmediatePropagation();
event.stopPropagation();
let files:File[]=[…event.dataTransfer.files];
让uploadFiles=等待此操作。uploadFiles(files);//后端调用
uploadedFiles.forEach(文件=>{
//针对不同的文件类型进行更改
this.insertContent(``);
})
})
}

你能发布你的
tinymce.init()
config吗,或者创建一个小提琴并用叉子叉吗?您还可以确认您使用的浏览器(名称和版本)吗?此外,您具体指的是TinyMCE文档中的哪一页?这解决了问题。我想补充的一点是,是否有一个选项可以限制可以放入编辑器的文件类型?这并没有解决我的问题。我创建了一个小提琴来显示在编辑器上删除图像时的错误消息。它只是在一个新选项卡中打开了删除的图像。有什么解决办法吗?