本文为大家分享了asp。net core 如何集成kindeditor并实现图片上传功能的具体方法,供大家参考,具体内容如下准备工作1。visual studio 2015 update3开发环境2。net core 1。0。1 及以上版本目录新建asp。
net core web项目下载kindeditor增加图片上传控制器配置kindeditor参数代码下载新建asp。net core web项目新建一个asp。net core项目,这里命名为kindeditor选中web应用程序下载kindeditor这里我们新建了一个系统自带的样本项目,去 kindeditor官网下载一个版本,解压后拷贝大wwwroot中修改views/index。
cshtml@{ ViewData[“Title”] = “Home Page”;}<link href=”~/kindeditor/themes/default/default。css” rel=”stylesheet” /><script src=”~/kindeditor/kindeditor-min。
js”></script><script src=”~/kindeditor/lang/zh_CN。js”></script> <div>getEditor(‘editor’)就能拿到相关的实例 KindEditor。ready(function (K) { window。editor = K。create(‘#detail_desc’, { width: ‘98%’, height: ‘500px’ }); }); </script>运行一下现在就可以看到kindeditor已经集成进来了。
增加图片上传控制器注意返回是一个json对象,因此建了一个简单的对象返回。using System;using System。Collections。Generic;using System。Linq;using System。Threading。
Tasks;using Microsoft。AspNetCore。Mvc;using Microsoft。AspNetCore。Http;using Microsoft。Net。Http。Headers;using Microsoft。AspNetCore。
Hosting;using System。IO;namespace kindeditortest。Controllers{ public class HomeController : Controller { private IHostingEnvironment hostingEnv; public IActionResult Index() { return View(); } public HomeController(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) { PicUploadResponse rspJson = new PicUploadResponse() { error = 0, url = “/upload/” }; long size = 0; 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(“。”)); 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 = 0; rspJson。url = $@”。/。/upload/” + tempname; return Json(rspJson); } public IActionResult About() { ViewData[“Message”] = “Your application description page。
“; return View(); } public IActionResult Contact() { ViewData[“Message”] = “Your contact page。”; return View(); } public IActionResult Error() { return View(); } } public class PicUploadResponse { public int error { get; set; } public string url { get; set; } }}配置kindeditor参数<script type=”text/javascript”> //实例化编辑器 //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE。
getEditor(‘editor’)就能拿到相关的实例 KindEditor。ready(function (K) { window。editor = K。create(‘#detail_desc’, { width: ‘98%’, height: ‘500px’, uploadJson: ‘/home/KindeditorPicUpload’, fileManagerJson: ‘/home/KindeditorPicUpload’, allowFileManager: true }); }); </script>运行效果源码下载:http://xiazai。
jb51。net/201611/yuanma/ASP。NETkindeditor(jb51。net)。rar。
1.文章《asp.net core集成kindeditor实现图片上传功能》援引自互联网,为网友投稿收集整理,仅供学习和研究使用,内容仅代表作者本人观点,与本网站无关,侵删请点击页脚联系方式。
2.文章《asp.net core集成kindeditor实现图片上传功能》仅供读者参考,本网站未对该内容进行证实,对其原创性、真实性、完整性、及时性不作任何保证。
相关推荐
- . 现代买票为什么带上携程保险
- . 潮阳怎么去广州南站
- . 湖南马拉河怎么样
- . 烧纸为什么到三岔路口
- . 百色为什么这么热
- . 神州租车怎么样
- . 芜湖方特哪个适合儿童
- . 护肤品保养液是什么类目
- . 早晚的护肤保养有哪些项目
- . 女孩护肤品怎么保养的最好