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. 《HelloGitHub月刊》第 09 期

    <HelloGitHub>第 09 期 兴趣是最好的老师,<HelloGitHub>就是帮你找到兴趣! 前言 转眼就到年底了,月刊做到了第09期,感谢大家一路的支持和帮助

  2. Scrum到底是个神马玩意儿

    从前有一种非常火爆的体育运动,对阵双方各派出11位猛男,在宽阔的草皮球场内争抢一颗可怜的小皮球.哪方能够通过团队协作拿到皮球,并且运送到对方场地的特定位置即得分. 没错,你没有走错片场,快到超级碗里来 ...

  3. 基于 Zookeeper 的分布式锁实现

    1. 背景 最近在学习 Zookeeper,在刚开始接触 Zookeeper 的时候,完全不知道 Zookeeper 有什么用.且很多资料都是将 Zookeeper 描述成一个“类 Unix/Linu ...

  4. leetcode — word-ladder

    import java.util.*; /** * Source : https://oj.leetcode.com/problems/word-ladder/ * * * Given two wor ...

  5. ASP.NET Core多环境配置文件问题

    前言 在我们开发的过程中,往往会有这几个环境,Dev.QA.Pre和Pro. 当然不同的环境可能大家的叫法会有点不一样. 最常遇到的问题,或许就是不同环境的配置文件问题! 一个环境一个配置文件是很常见 ...

  6. kubernetes系列06—kubernetes资源清单定义入门

    本文收录在容器技术学习系列文章总目录 1.认识kubernetes资源 1.1 常用资源/对象 workload工作负载型资源:pod,ReplicaSet,Deployment,StatefulSe ...

  7. Django学习笔记(7)——单表操作和多表操作

    单表操作 1,创建模型 创建名为book的APP,在book下的models.py中创建模型: from django.db import models # Create your models he ...

  8. 第13章 切换到混合流并添加API访问 - Identity Server 4 中文文档(v1.0.0)

    在之前的快速入门中,我们探讨了API访问和用户身份验证.现在我们想把这两个部分放在一起. OpenID Connect和OAuth 2.0组合的优点在于,您可以使用单个协议和使用令牌服务进行单次交换来 ...

  9. 微信小程序picker的坑

    js文件: Companyarr: [{ id: '公司id1', companyname: "公司1的名字" }, { id: '公司id2', companyname: &qu ...

  10. centos7 Failed to start firewalld.service: Unit is masked.

    centos7 启动防火墙失败:Failed to start firewalld.service: Unit is masked.   ---- 刚yum安装了iptables 解决: 执行”sys ...