Ck Editor 4 中的图片上传器看不到加载的图片

问题描述 投票:0回答:1

我正在使用 Ck 编辑器来编辑我的描述字段。当我点击上传文件时,它可以,但 ckeditor 不会在文本区域上渲染图像。

这是我在 _Layout.cshtml 中使用的配置函数

    <script src="~/template/plugins/ckeditor/ckeditor.js"></script> 
    <script>
        function RenderCkEditor(inputId) {
            CKEDITOR.replace(inputId, {
                height: 300,
                filebrowserImageUploadUrl: '@Url.Action("UploadFile", "Default", new { Area = Areas.admin })',
                filebrowserUploadUrl: '@Url.Action("UploadFile", "Default", new { Area = Areas.admin })'
            });
            CKEDITOR.config.extraPlugins = 'font';
            var fontsizevariable = '12';
            var fontfamilyvariable = 'Arial';

            CKEDITOR.on('instanceReady', function (ev) {
                ev.editor.dataProcessor.htmlFilter.addRules({
                    elements: {
                        p: function (e) { e.attributes.style = 'font-size:' + fontsizevariable + 'px; font-family:' + fontfamilyvariable + ';'; }
                    }
                });
            });
        } 
    </script>
// Rendering the ck editor its OK.

@section Scripts {
    <script> 
        RenderCkEditor('Corporate_Description');
    </script>
}

我正在选择图像并将其发送到服务器。一切都好。发送后,我将返回具有 url 和状态的 ab json 对象。

[HttpPost]
public async Task<IActionResult> UploadFile()
{
    var uploadResult = await _fileUpload.Upload(Request.Form.Files[0], "editor", "files");
    if (uploadResult.Succeed)
    {
        var baseUri = $"{Request.Scheme}://{Request.Host}//{uploadResult.Data}";
        return Json(new { uploaded = true, baseUri });
    }
    else
    {
        return BadRequest("Error:" + uploadResult.Message);
    }
}

这些是浏览器控制台中的错误消息;

ckeditor.js:21[CKEDITOR] 错误代码:剪贴板图像处理禁用。

ckeditor.js:21 [CKEDITOR] 有关此错误的更多信息,请访问 https://ckeditor.com/docs/ckeditor4/latest/guide/dev_errors.html#clipboard-image-handlin

我在不同的项目中使用相同的代码,它可以工作。我想不通。

我尝试了不同版本的Ck编辑器,但没有成功。

asp.net asp.net-mvc ckeditor ckeditor5 ckeditor4.x
1个回答
0
投票

我将返回 json 更改为:

return Json(new{uploaded = 1, url = baseUri}); 

然后就成功了。

© www.soinside.com 2019 - 2024. All rights reserved.