在.net core的web项目中使用kindeditor
本项目是一个.net core的mvc项目
1.下载kindeditor 4.1.11 解压后将文件夹置于 wwwroot目录下,如图:

2.在HomeController的Index控制器对应的index视图输入一下代码:
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>我是管理员首页</title>
@*首先要引入关键的两个js*@
<script charset="utf-8" src="/kindeditor/kindeditor-all-min.js"></script>
<script charset="utf-8" src="/kindeditor/lang/zh-CN.js"></script>
@*创建KindEditor对象*@
<script>
KindEditor.ready(function (K) {
K.create('#editor_id', {
//注意kindeditor包里面自带的是一个ashx的一班处理程序 此处改为mvc的控制器方法
uploadJson: '@Url.Action("KindeditorPicUpload", "KEUpload")',
//fileManagerJson: '/kindeditor/asp.net/file_manager_json.ashx',
allowFileManager: true
});
});
</script>
</head>
<body>
<div>管理从此开始</div>
<form action="/home/index" method="post">
<div>
<textarea id="editor_id" name="content" style="width:700px;height:300px;">
<strong>HTML内容</strong>
</textarea>
</div>
<div><input type="submit" value="提交" /></div>
</form>
</body>
</html>
3.在以上代码中 使用到了KindeditorPicUpload控制的KEUpload用于处理文本编辑器里面的图片上传
下面是这个控制器代码:
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using System.Collections.Generic;
using System.IO;
using System.Net.Http.Headers; namespace Kdeditor.Start.Controllers
{
public class KEUploadController : Controller
{
private IHostingEnvironment hostingEnv;
public IActionResult Index()
{
return View();
}
public KEUploadController(IHostingEnvironment env)
{
this.hostingEnv = env;
}
/// <summary>
/// Kindeditor图片上传
/// </summary>
/// <param name="imgFile">Kindeditor图片上传自带的命名,不可更改名称</param>
/// <param name="dir">不可更改名称 这里没有用到dir</param>
/// <returns></returns>
public IActionResult KindeditorPicUpload(IList<IFormFile> imgFile, string dir)
{
//http://www.cnblogs.com/fireicesion/p/9490901.html
//https://www.cnblogs.com/fishpro/p/how_upload_pic_with_kindeditor_for_asp_net_core.html
//注意 如果是上传到本地这个文件夹子 那么事先必须创建这个文件夹
PicUploadResponse rspJson = new PicUploadResponse() { error = , url = "/upload/" };
long size = ;
string tempname = "";
foreach (var file in imgFile)
{
var filename = ContentDispositionHeaderValue
.Parse(file.ContentDisposition)
.FileName
.Trim('"');
//获取每个图片的扩展名
var extname = filename.Substring(filename.LastIndexOf("."), filename.Length - filename.LastIndexOf("."));
//创建新的文件名 guid+扩展名
var filename1 = System.Guid.NewGuid().ToString() + extname;
tempname = filename1;
var path = hostingEnv.WebRootPath;
filename = hostingEnv.WebRootPath + $@"\upload\{filename1}";
size += file.Length;
using (FileStream fs = System.IO.File.Create(filename))
{
file.CopyTo(fs);
fs.Flush();
//这里是业务逻辑
}
}
rspJson.error = ;
rspJson.url = $@"../../upload/" + tempname;
return Json(rspJson);
} }
public class PicUploadResponse
{
public int error { get; set; }
public string url { get; set; }
} }
注意这个方法由于是.net core的 所以跟.net framework的有很大区别。
这个代码如果在文本编辑器里上传图片 会将图片传入wwwroot目录下的upload目录中
done!
效果如下图:

在.net core的web项目中使用kindeditor的更多相关文章
- C# 动态创建SQL数据库(二) 在.net core web项目中生成二维码 后台Post/Get 请求接口 方式 WebForm 页面ajax 请求后台页面 方法 实现输入框小数多 自动进位展示,编辑时实际值不变 快速掌握Gif动态图实现代码 C#处理和对接HTTP接口请求
C# 动态创建SQL数据库(二) 使用Entity Framework 创建数据库与表 前面文章有说到使用SQL语句动态创建数据库与数据表,这次直接使用Entriy Framwork 的ORM对象关 ...
- 在基于MVC的Web项目中使用Web API和直接连接两种方式混合式接入
在我之前介绍的混合式开发框架中,其界面是基于Winform的实现方式,后台使用Web API.WCF服务以及直接连接数据库的几种方式混合式接入,在Web项目中我们也可以采用这种方式实现混合式的接入方式 ...
- 真分布式SolrCloud+Zookeeper+tomcat搭建、索引Mysql数据库、IK中文分词器配置以及web项目中solr的应用(1)
版权声明:本文为博主原创文章,转载请注明本文地址.http://www.cnblogs.com/o0Iris0o/p/5813856.html 内容介绍: 真分布式SolrCloud+Zookeepe ...
- JAVA WEB项目中各种路径的获取
JAVA WEB项目中各种路径的获取 标签: java webpath文件路径 2014-02-14 15:04 1746人阅读 评论(0) 收藏 举报 分类: JAVA开发(41) 1.可以在s ...
- Web 项目中分享到微博、QQ空间等分享功能
Web 项目中分享到微博.QQ空间等分享功能 网上有很多的模板以及代码,但是有很多都不能分享内容,简单的测试了下: 以新浪微博为例,文本框中的内容是title属性,下面的链接是url属性,如果你的链接 ...
- 【Filter 不登陆无法访问】web项目中写一个过滤器实现用户不登陆,直接给链接,无法进入页面的功能
在web项目中写一个过滤器实现用户不登陆,直接给链接,无法进入页面,而重定向到登陆界面的功能. 项目是用springMVC+spring+hibernate实现 (和这个没有多大关系) 第一步: 首先 ...
- java web项目中 获取resource路径下的文件路径
public GetResource{ String path = GetResource.class.getClassLoader().getResource("xx/xx.txt&quo ...
- web项目中加入struts2、spring的支持,并整合两者
Web项目中加入struts2 的支持 在lib下加入strut2的jar包 2. 在web.xml中添加配置 <filter> <filter-name>struts2< ...
- Java Web学习系列——Maven Web项目中集成使用Spring、MyBatis实现对MySQL的数据访问
本篇内容还是建立在上一篇Java Web学习系列——Maven Web项目中集成使用Spring基础之上,对之前的Maven Web项目进行升级改造,实现对MySQL的数据访问. 添加依赖Jar包 这 ...
随机推荐
- 高并发解决方案--负载均衡(HTTP,DNS,反向代理服务器)(解决大流量,高并发)
高并发解决方案--负载均衡(HTTP,DNS,反向代理服务器)(解决大流量,高并发) 一.总结 1.什么是负载均衡:当一台服务器的性能达到极限时,我们可以使用服务器集群来提高网站的整体性能.那么,在服 ...
- 【29.27%】【hdu 5908】Abelian Period
Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 262144/131072 K (Java/Others) 问题描述 设SS是一个数字串,定义 ...
- 最简单的基于FFmpeg的移动端样例:IOS HelloWorld
===================================================== 最简单的基于FFmpeg的移动端样例系列文章列表: 最简单的基于FFmpeg的移动端样例:A ...
- 【Lucene4.8教程之三】搜索 2014-06-21 09:53 1532人阅读 评论(0) 收藏
1.关键类 Lucene的搜索过程中涉及的主要类有以下几个: (1)IndexSearcher:执行search()方法的类 (2)IndexReader:对索引文件进行读操作,并为IndexSear ...
- 【54.38%】【BZOJ 4300】绝世好题
Time Limit: 1 Sec Memory Limit: 128 MB Submit: 1120 Solved: 609 [Submit][Status][Discuss] Descript ...
- Codeforces 491B. New York Hotel 最远曼哈顿距离
最远曼哈顿距离有两个性质: 1: 对每一个点(x,y) 分别计算 +x+y , -x+y , x-y , -x-y 然后统计每种组合的最大值就能够了, 不会对结果产生影响 2: 去掉绝对值 , 设 ...
- JavaScript 正則表達式
一.简单介绍 1.什么是正則表達式 正則表達式本身就是一种语言,这在其他语言是通用的. 正則表達式(regular expression)描写叙述了一种字符串匹配的模式,能够用来检查一个串是否含有某种 ...
- js如何使用正则表达式验证电话号码(可选区号)和邮箱?(分步骤)
js如何使用正则表达式验证电话号码(可选区号)和邮箱?(分步骤) 一.总结 js进阶正则表达式16电话号码和邮箱正则(分类解决邮箱验证)(分组加?解决电话号码区号选择问题)([\w\.-]中括号解决邮 ...
- PHP怎么读写XML?(四种方法)
PHP怎么读写XML?(四种方法) 一.总结 1.这四种方法中,字符串的方式是最原始的方法.SimpleXML和DOM扩展是属于基于树的解析器,把整个文档存储为树的数据结构中,需要把整个文档都加载到内 ...
- 【u021】广义斐波那契数列
Time Limit: 1 second Memory Limit: 128 MB [问题描述] 广义的斐波那契数列是指形如an=p*an-1+q*an-2的数列.今给定数列的两系数p和q,以及数列的 ...