CKEditor 4 и ASP. NET core MVC: Как изменить URL изображения в ckeditor - PullRequest
0 голосов
/ 18 февраля 2020

Я использую CKEditor 4 для записи в блоге. Я загружаю изображение и возвращаю URL изображения. Всякий раз, когда я нажимаю SOURCE на моем ckeditor, я вижу "https://localhost: 5001 / 88e4174d-8d8f-b041-8af0-9503a0ec7dfd" width = "1776" /> "как мне изменить источник на изображение URL вернулся?

1 Ответ

1 голос
/ 19 февраля 2020

Всякий раз, когда я нажимаю SOURCE на моем ckeditor, я вижу "https://localhost: 5001 / 88e4174d-8d8f-b041-8af0-9503a0ec7dfd " width = "1776" /> "как я могу изменить источник на возвращаемое изображение?

Я провел тест со следующим примером кода, который хорошо работает на моей стороне, вы можете обратиться к нему.

В просмотреть страницу

<textarea name="blog_input"></textarea>

@section scripts{

    <script src="https://cdn.ckeditor.com/4.10.1/standard/ckeditor.js"></script>
    <script>
        CKEDITOR.replace('blog_input', {
            filebrowserImageUploadUrl: '/Home/UploadImage'
        });
    </script>
}

Примечание : установить filebrowserImageUploadUrl свойство с настраиваемым URL-адресом ImageUpload для CKEditor

Действие UploadImage

[HttpPost]
public async Task<ActionResult> UploadImage(IFormFile upload)
{
    if (upload.Length <= 0) return null;

    //your custom code logic here

    //1)check if the file is image

    //2)check if the file is too large

    //etc

    var fileName = Guid.NewGuid() + Path.GetExtension(upload.FileName).ToLower();

    //save file under wwwroot/CKEditorImages folder

    var filePath = Path.Combine(
        Directory.GetCurrentDirectory(), "wwwroot/CKEditorImages",
        fileName);

    using (var stream = System.IO.File.Create(filePath))
    {
        await upload.CopyToAsync(stream);
    }

    var url = $"{"/CKEditorImages/"}{fileName}";

    var successMessage = "image is uploaded";

    dynamic success = Newtonsoft.Json.JsonConvert.DeserializeObject("{ 'uploaded': 1,'fileName': \"" + fileName + "\",'url': \"" + url + "\", 'error': { 'message': \"" + successMessage + "\"}}");
    return Json(success);
}

Результат теста

1) выбрать и загрузить локальный файл

enter image description here

2) источник изображения в CKEditor

enter image description here

...