Asp.Net Core 网站使用TinyMCE实现上传图片

最新推荐文章于 2024-08-13 02:58:00 发布

weixin_30699955

最新推荐文章于 2024-08-13 02:58:00 发布

阅读量495

点赞数

原文链接：http://www.cnblogs.com/tianjiuyi/p/10215646.html

版权

1、下载TinyMCE

https://www.tiny.cloud/get-tiny/self-hosted/

解压缩后放在网站wwwroot目录

2、下载中文语言包

https://www.tiny.cloud/get-tiny/language-packages/

解压缩后放在langs目录

3、添加Razor页面

指定images_upload_url参数，实现图片文件的上传功能。此路径指向的地址为步骤4中创建Controller
指定language，语言使用中文简体。

@page
@model CourseAssistant.Pages.TinyMCE.IndexModel
@{
}
<script src="~/js/tinymce/tinymce.min.js"></script>
<script>
    tinymce.init({
        height: 550,
        menubar: false,
        language: 'zh_CN',
        selector: 'textarea',
        images_upload_url: '/TinyMCE/Upload',
        plugins: [
            'advlist autolink lists link image imagetools charmap print preview anchor textcolor',
            'searchreplace visualblocks code fullscreen ',
            'insertdatetime media table contextmenu paste code help wordcount'
        ],
        toolbar: 'preview link code insertdatetime  charmap | media  image | undo redo |  formatselect | bold italic backcolor  | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent  | removeformat | help',
    });
</script>


<textarea>
</textarea>

4、添加UploadController.cs

using Microsoft.AspNetCore.Mvc;
using System.IO;
using Microsoft.AspNetCore.Hosting;

namespace CourseAssistant.Pages.TinyMCE
{
    [Route("TinyMCE/[controller]")]
    public class UploadController : Controller
    {
        IHostingEnvironment hostingEnvironment;
        public UploadController(IHostingEnvironment hostingEnvironment)
        {
            this.hostingEnvironment = hostingEnvironment;
        }
        [HttpPost]
        public string Post()
        {
            var files = Request.Form.Files;
            if (files.Count==0)
            {
                return "No File";
            }
            var file = files[0];
            var path = hostingEnvironment.WebRootPath;
            var UploadDir = "UploadFiles";
            var fulldir = Path.Combine(path, UploadDir);
            if (!Directory.Exists(fulldir)) Directory.CreateDirectory(fulldir);
            var filename = file.FileName;
            var fullpath = Path.Combine(path, UploadDir, filename);
            using (var fs=new FileStream(fullpath, FileMode.Create, FileAccess.Write))
            {
                file.CopyTo(fs);
                fs.Close();
            }
            var url = $"/{UploadDir}/{filename}";
            var fi = new fileinfo() { location = url };
            var s = fi.ToString();
            return s;
        }
    }
    public class fileinfo:JsonObject<fileinfo>
    {
        public string location { get; set; }
    }
}