我正在使用 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编辑器,但没有成功。
我将返回 json 更改为:
return Json(new{uploaded = 1, url = baseUri});
然后就成功了。