dotnetcore ueditor

 https://github.com/durow/ueditornetcore

http://www.cnblogs.com/durow/p/6116393.html

1、在 http://ueditor.baidu.com/website/download.html 下载ueditor 压缩包;

2、解压后, 把net目录(.net服务器端源码)和index.html删除后,把其余内容copy至aspnetcore项目的/wwwroot/lib/ueditor 目录下;
3、在/wwwroot目录下建upload/image目录(也可不建,程序应该可以自动建);
4、安装UEditorNetCore

Install-Package UEditorNetCore
5、在Startup.cs的ConfigureServices方法中添加UEditorNetCore服务

public void ConfigureServices(IServiceCollection services)
{  
//第一个参数为配置文件路径,默认为项目目录下config.json  
 //第二个参数为是否缓存配置文件,默认false  
services.AddUEditorService()  
services.AddMvc();
}
6、在controller 目录中添加用于处理来自UEditor请求的Controller

[Route("api/[controller]")] //配置路由
public class UEditorController : Controller
{
private UEditorService ue;
public UEditorController(UEditorService ue)
{
this.ue = ue;
}
public void Do()
{
ue.DoAction(HttpContext);
}
}
7、修改前端配置文件ueditor.config.js

serverUrl需要参照第3步Controller中配置的路由,按照上面步骤3中的配置,需要以下配置:

serverUrl:"/api/UEditor"

这样配置后当前端要获取服务端UEditor配置时就会访问/api/UEditor?action=config。

8、从其他项目(如yuexxin,jShop)中copy config.json到项目根目录下;

修改服务端配置config.json

上传类的操作需要配置相应的PathFormat和Prefix。示例部署在web根目录,因此Prefix都设置为"/"。使用时要根据具体情况配置。 例如示例中图片上传的配置如下:

"imageUrlPrefix": "/", /* 图片访问路径前缀 */
 "imagePathFormat": "upload/image/{yyyy}{mm}{dd}/{time}{rand:6}",

关于PathFormat的详细配置可参照官方文档。

9、在需要应用ueditor编辑器的view(或_layout.cshtml)中添加javascript引用

<script type="text/javascript" charset="utf-8" src="~/lib/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="~/lib/ueditor/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="~/lib/ueditor/lang/zh-cn/zh-cn.js"></script>
 

10、

扩展action

UEditor前端和后端交互主要通过在url中给出不同的action参数实现的,例如/api/UEditor?action=config会从服务端获取UEditor配置信息。UEditorNetCore目前支持的有8种action:

config 获取服务端配置信息
uploadimage 上传图片
uploadscrawl 上传涂鸦
uploadvideo 上传视频
uploadfile 上传文件
listimage 多图片上传
listfile 多文件上传
catchimage 抓取图片

如果以上action无法满足需求,可以方便的增加、覆盖、移除action。

增加action

public void ConfigureServices(IServiceCollection services)
{
services.AddUEditorService() .Add("test", context => { context.Response.WriteAsync("from test action"); }) .Add("test2", context => { context.Response.WriteAsync("from test2 action"); }); services.AddMvc();}

以上代码增加了名字为test和test2两个action,作为示例仅仅返回了字符串。当访问/api/UEditor?action=test时会返回"from test action"。在扩展action时可以使用Config获取服务端配置,也可以使用已有的Handlers,具体可以参考源代码。

覆盖现有action

上面的Add方法除了添加新action外还可以覆盖现有action。当现有的action可能不符合你的要求,可以Add一个同名的action覆盖现有的。

移除action

如果要移除某个action,可以使用Remove方法。

public void ConfigureServices(IServiceCollection services)
{
services.AddUEditorService() .Remove("uploadvideo"); services.AddMvc();
}

以上代码中的Remove("uploadvideo")方法移除了名为uploadvideo的action。

0x04 相关资源

UEditorNetCore代码和示例:https://github.com/durow/UEditorNetCore
UEditor代码:https://github.com/fex-team/ueditor  
UEditor官网:http://ueditor.baidu.com/website/index.html

dotnetcore ueditor的更多相关文章

  1. 在ASP.NET Core中使用百度在线编辑器UEditor

    在ASP.NET Core中使用百度在线编辑器UEditor 0x00 起因 最近需要一个在线编辑器,之前听人说过百度的UEditor不错,去官网下了一个.不过服务端只有ASP.NET版的,如果是为了 ...

  2. 对百度的UEditor多图片上传的一些补充

    我已经写了一篇文章关于百度的UEditor提取多图片上传模块.如果还没有看过,请点击以下链接查看 http://www.cnblogs.com/luke1006/p/3719029.html 出差了两 ...

  3. 关于百度编辑器UEditor的一点说明

    大家在使用的时候要特别注意editor_config.js中的“URL”这个参数 我的理解:1.这个参数是editor整个结构的总路径          2.首先要把这个路径配置好了.才能正常的显示, ...

  4. UEditor编辑器使用示例

    1. UEditor下载 UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. 下载链接:http ...

  5. ASP.NET MVC5+EF6+EasyUI 后台管理系统(57)-插件---ueditor使用

    系列目录 目录: 前言 开发环境 知识点 初始使用 自定义工具栏 设置和读取编辑器内容 文件上传 ueditor加水印 ---------------------------------------- ...

  6. 创建或打开解决方案时提示"DotNetCore.1.0.1-SDK.1.0.0.Preview2-003131-x86"错误的解决方案

    提示"DotNetCore.1.0.1-SDK.1.0.0.Preview2-003131-x86"错误的解决方案: 1.检查是否有C:\Program Files (x86)\d ...

  7. UEditor百度富文本编辑器--让编辑器自适应宽度的解决方案

    UEditor百度富文本编辑器的initialFrameWidth属性,默认值是1000. 不能够自适应屏幕宽度.如图1: 刚开始的时候,我是直接设置initialFrameWidth=null的.效 ...

  8. UEditor百度富文本编辑器--preview在线预览时头部被挡住的解决方案

    问题截图: 正常情况应该是如下显示: 解决方案: 1.打开ueditor/dialogs/preview/preview.html 2.找到body节点下面这一句 document.getElemen ...

  9. 百度编辑器UEditor与UEditor 公式插件完整Demo

    1.下载UEditor(我的是.net项目) 2.下载UEditor公式插件 3.新建解决方案和项目 4.在浏览器中预览index.html页面 结果: 5.index.html源码 <!DOC ...

随机推荐

  1. leetcode — longest-consecutive-sequence

    import java.util.HashSet; import java.util.Set; /** * Source : https://oj.leetcode.com/problems/long ...

  2. scrapy爬虫学习系列一:scrapy爬虫环境的准备

    系列文章列表: scrapy爬虫学习系列一:scrapy爬虫环境的准备:      http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_python_00 ...

  3. RDIFramework.NET平台代码生成器V3.2版本全新发布(提供下载-免费使用)

    回顾V3.1版本更新内容如下: 1.增加对Oracle表创建语句的查看. 2.新增对MySql的代码生成支持. 3.全面重构对多线程的支持,改变以前会无故退出的现象. 本次在V3.1版本的基础上,增加 ...

  4. jquery/js知识点收藏

    1]关于页面跳转 "window.location.href"."location.href"是本页面跳转 "parent.location.href ...

  5. 浅谈_依赖注入 asp.net core

    1.1什么是依赖 我们先看下图 可以简单理解,一个HomeController类使用到了DBContext类,而这种关系是有偶然性,临时性,弱关系的,但是DBContext的变化会影响到HomeCon ...

  6. Docker安装nginx

    直切正题: 一.安装nginx docker pull nginx 二.启动nginx容器 docker run --name mynginx -d -p : nginx 命令说明: -p 80:80 ...

  7. Java开发笔记(二十四)方法的组成形式

    经过前面的学习,我们发现演示的Java代码越来越复杂,而且每个例子的代码都堆在入口方法main内部,这会导致如下问题:1.一个方法内部堆砌了太多的代码行,看着费神,维护起来也吃力:2.部分代码描述的是 ...

  8. Java 学习笔记 网络编程 使用Socket传输文件 CS模式

    Socket的简单认识 Socket是一种面向连接的通信协议,Socket应用程序是一种C/S(Client端/Server端)结构的应用程序 Socket是两台机器间通信的端点. Socket是连接 ...

  9. Java学习笔记之——异常处理

    1.异常: 在程序运行时,发生了一些错误导致程序不能正常结束或者中断 2.异常导致的后果 Java程序的执行过程中如果出现异常事件,可以生成一个异常类对象,该异常对象封装了异常事件的信息,并将其被提交 ...

  10. jQuery.Ajax IE8,9 无效(CORS跨域)

    今天在开发网站的时候,发现一个问题,$.ajax()在 IE8,9 浏览器不起作用,但 Chrome,Firefox ,360,IE10以上等浏览器却是可以的,网上资料很多,查询最后发现是 IE8,9 ...