CKEditor使用,前端代码及后台处理代码


<html lang="en">
<head>
    <meta charset="utf-8">
    <title>CKEditor 5 – Document editortitle>
    <script src="//cdn.ckeditor.com/ckeditor5/11.2.0/decoupled-document/ckeditor.js">script>
head>
<body>
    <h1>Document editorh1>
    
    <div id="toolbar-container">div>

    
    <div id="editor">
        <p>This is the initial editor content.p>
    div>

    <script>
        DecoupledEditor
            .create(document.querySelector('#editor'), {
                ckfinder: {
                    uploadUrl: "/CKEditor/Upload"
                }
            })
            .then(editor => {
                const toolbarContainer = document.querySelector('#toolbar-container');
                toolbarContainer.appendChild(editor.ui.view.toolbar.element);
            })
            .catch(error => {
                console.error(error);
            });


    script>
body>
html>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using Newtonsoft.Json;

namespace WebApplication.Controllers
{
    public class CKEditorController : Controller
    {
        public IActionResult Upload(List files)
        {
            //https://ckeditor.com/docs/ckeditor5/latest/framework/guides/deep-dive/upload-adapter.html
            var req = Request;
            Dictionary dic = new Dictionary()
            {
                {  "uploaded" , "true" },
                {  "url" , "/favicon.ico" }
            };
            return Json(dic);
        }
    }
}

你可能感兴趣的:(C#)