在.NET Framework中使用UEditor时,只需要将UEditor提供的后端服务,部署为一个子程序,即可直接使用文件上传相关的服务,但是UEditor官方并未提供.Net Core的项目,并且.NET Core项目很多时候是跑在Linux上面的,也没有子程序一说。

为了解决这个问题,我开发了一个.NET Core版本的后端服务,他已经在Github上开源https://github.com/baiyunchen/UEditor.Core,并提供了比较优质的中文文档供大家参考。

大家可以参考Github中的文档和源码,以下内容时从Github中Copy而来:

建议别往下看了,直接去看Github中的内容!觉得有用的,请在Github上留下你的Star

安装

建议从从nuget安装

  • 方式1:可以直接在Nuget中搜索UEditor.Core并安装

  • 方式2:通过命令行安装

  1. Install-Package UEditor.Core

配置

并在Startup.cs中的ConfigureServices方法中,加入以下代码:

  1. services.AddUEditorService("ueditor.json",true);

由于.Net Core默认只会从wwwroot目录加载静态文件,其他文件夹的静态文件无法正常访问。而我们希望将图片上传到网站根目录的upload文件夹下,所以需要额外在Startup.cs类的Configure方法中,增加如下代码:

  1. app.UseStaticFiles(new StaticFileOptions
  2. {
  3. FileProvider = new PhysicalFileProvider(
  4. Path.Combine(Directory.GetCurrentDirectory(), "upload")),
  5. RequestPath = "/upload",
  6. OnPrepareResponse = ctx =>
  7. {
  8. ctx.Context.Response.Headers.Append("Cache-Control", "public,max-age=36000");
  9. }
  10. });

然后在项目的根目录,创建upload文件夹(这里不创建会报错)。

接下来,我们需要将ueditor后端的config.js 改名ueditor.json添加到项目根目录。

这里的配置文件可以在ueditor的下载包中,net文件夹下面找到,目前版本的具体路径如下: ueditor1_4_3_3-utf8-net\utf8-net\net\config.json

如果你懒得下载,也可以在本项目GitHub的Sample.Web下面找到ueditor.json文件,然后粘贴到你项目的根目录下。

如果你是从UEditor的下载包中复制的该文件,需要全局将该文件中的/ueditor/net/替换为/

创建后端接口

创建一个UEditorController,并添加如下代码:

  1. public class UEditorController : Controller
  2. {
  3. private readonly UEditorService _ueditorService;
  4. public UEditorController(UEditorService ueditorService)
  5. {
  6. this._ueditorService = ueditorService;
  7. }
  8.  
  9. [HttpGet, HttpPost]
  10. public ContentResult Upload()
  11. {
  12. var response = _ueditorService.UploadAndGetResponse(HttpContext);
  13. return Content(response.Result, response.ContentType);
  14. }
  15. }

引入ueditor并配置

从ueditor官网下载最新版本的压缩包,并放到项目的wwwroot下面的lib文件夹中,然后在你需要的使用UEditor的页面或全局引入ueditor.config.jsueditor.all.min.js文件。

打开ueditor.config.js文件,将其中的serverUrl项改为:/ueditor/upload

开始使用UEditor

这部分如果遇到问题,请参考UEditor的官方文档http://fex.baidu.com/ueditor/

在你需要使用UEditor的HTML代码中,添加如下代码:

  1. <script id="container" name="content" type="text/plain">
  2. 欢迎使用Ueditor.Core
  3. </script>

然后在页面的最后添加如下JS代码:

  1. <script type="text/javascript">
  2. var ue = UE.getEditor('container', {
  3. initialFrameHeight: 500
  4. });
  5. </script>

在 .NET Core项目中使用UEditor图片、文件上传服务的更多相关文章

  1. .Net Core 图片文件上传下载

    当下.Net Core项目可是如雨后春笋一般发展起来,作为.Net大军中的一员,我热忱地拥抱了.Net Core并且积极使用其进行业务的开发,我们先介绍下.Net Core项目下实现文件上传下载接口. ...

  2. 一个简单的QQ隐藏图生成算法 通过jQuery和C#分别实现对.NET Core Web Api的访问以及文件上传

    一个简单的QQ隐藏图生成算法   隐藏图不是什么新鲜的东西,具体表现在大部分社交软件中,预览图看到的是一张图,而点开后看到的又是另一张图.虽然很早就看到过这类图片,但是一直没有仔细研究过它的原理,今天 ...

  3. commons-fileload图片文件上传工具 , servlet文件图片上传案列

    本案列是java  maven工程小项目,提供个大家学习! 1.在pom.xml文件中导入依赖: <!--文件上传依赖--><dependency> <groupId&g ...

  4. SpringMvc MultipartFile 图片文件上传

    spring-servlet.xml <!-- SpringMVC上传文件时,需要配置MultipartResolver处理器 --> <bean id="multipar ...

  5. springmvc图片文件上传接口

    springmvc图片文件上传 用MultipartFile文件方式传输 Controller package com.controller; import java.awt.image.Buffer ...

  6. UEditor Flash文件上传-crossdomain.xml文件配置

    在使用UEditor富文本时,如果客户端的浏览器是低版本浏览器,如IE7.IE8等,UEditor的文件上传方式将会使用flash方式上传而不是html5,而flash在跨域时唯一的限制策略就是cro ...

  7. zt对于C#中的FileUpload解决文件上传大小限制的问题设置

    对于C#中的FileUpload解决文件上传大小限制的问题设置 您可能没意识到,但对于可以使用该技术上载的文件的大小存在限制.默认情况下,使用 FileUpload 控件上载到服务器的文件最大为 4M ...

  8. 分享知识-快乐自己:SpringMvc中的单多文件上传及文件下载

    摘要:SpringMvc中的单多文件上传及文件下载:(以下是核心代码(拿过去直接能用)不谢) <!--设置文件上传需要的jar--> <dependency> <grou ...

  9. ueditor 图片粘贴上传,实现图文粘贴,图片自动上传

    如何做到 ueditor批量上传word图片? 1.前端引用代码 <!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN& ...

随机推荐

  1. PHP 抽象类实现接口注意事项(含PHP与.Net的区别)

    最近在学习Drupal8,看到源码里面一个抽象类BlockBase实现了一个接口BlockPluginInterface,但是并没有实现该接口的所有方法.然后我就不淡定了,因为之前是做.NET的,记忆 ...

  2. maven 编译打包时,明明类文件没有问题,却提示错误:未结束的字符串字面值,maven-compiler-plugin:2.3.2

    maven错误提示如下: Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:2.3.2:compile (de ...

  3. [WinCE | VS2008 | Solution] VS2008 building WinCE projects taking a long time

    1. Open C:\Windows\Microsoft.NET\Framework\v3.5\Microsoft.CompactFramework.Common.targets 2. Find pa ...

  4. MySQL 5.7.24 privileges有哪些?

    root@localhost:3306.sock [mysql]>select version();+------------+| version()  |+------------+| 5.7 ...

  5. 模仿SDWebImage实现异步加载图片

    模仿SDWebImage实现异步加载图片 SDWebImage想必大家都不陌生吧,要实现它的图片异步加载功能这个还是很简单的. 注意:此处我只实现了异步加载图片,并没有将文件缓存到本地的打算哦:) 源 ...

  6. 审计系统---初识堡垒机180501【all】

    堡垒机背景[审计系统] SRE是指Site Reliability Engineer (/运维工程师=运行维护 业务系统) 运维: 维护系统,维护业务,跟业务去走 防火墙: 禁止不必要的访问[直接访问 ...

  7. 企业级NFS网络文件共享服务_【all】

    1.1. 什么是NFS(1台机器提供服务) Network File System(网络文件系统)通过局域网让不同的主机系统之间共享文件或目录. NFS客户端可以通过挂载的方式将NFS服务器端共享的数 ...

  8. iptables简单规则记录

    先来一句:好记性不如烂笔头! 1.iptables简介 iptables是基于包过滤的防火墙,它主要工作在osi模型的2,,4层,也可以工作在7层(iptables + squid) 2.原理 防火墙 ...

  9. Linux上安装ZooKeeper并设置开机启动(CentOS7+ZooKeeper3.4.10)

    1下载Zookeeper 2安装启动测试 2.1上载压缩文件并解压 2.2新建 zookeeper配置文件 2.3安装JDK 2.4启动zookeeper 2.5查看zookeeper的状态 3将Zo ...

  10. Kubernetes dashboard 配置

    安装前准备 下载dashboard的yaml文件 wget -O kube-dashboard.yaml https://git.io/kube-dashboard-no-rbac 这个版本是没有权限 ...