1、前台需要引入官方库
<link href="/Content/bootstrap.css" rel="stylesheet" />
<link href="/Scripts/Plugin/bootstrap-summernote/summernote.css" rel="stylesheet" />
<script src="/Scripts/Plugin/bootstrap-summernote/summernote.min.js"></script>
<script src="/Scripts/Plugin/bootstrap-summernote/lang/summernote-zh-CN.min.js"></script>
2、定义控件
<div id="divContent"></div>
3、js初始化时设置上传服务器
$('#divContent').summernote({
height: 300,
minHeight: null,
maxHeight: 500,
callbacks: {
onImageUpload: function (files) {
var formData = new FormData();
formData.append('file', files[0]);
$.ajax({
url: 'UploadManage.ashx?action=Upload',
type: "POST",
data: formData,
dataType: 'JSON',
processData: false,//告诉jQuery不要加工数据
contentType: false,
success: function (data) {
if (data.Result == 1) {
$('#divContent').summernote('insertImage', data.Data, 'img');
} else {
alert(data.Data);
}
},
error: function (data) {
alert(data);
}
});
}
}
});
4、UploadManage.ashx文件,用于服务端接收files内容上传保存
using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Web;
using WebCore;
using WebCore.Entitys;
using WebProcess.Adapter;
using WebProcess.common;
namespace Service
{
/// <summary>
/// UploadManage 的摘要说明
/// </summary>
public class UploadManage : IHttpHandler
{
ProcessResult result = new ProcessResult();
public void ProcessRequest(HttpContext context)
{
string action = context.Request["action"] == null ? "" : context.Request["action"].ToString();
CheckAction(action, context);
context.Response.Write(JsonConvert.SerializeObject(result));
}
private void CheckAction(string action, HttpContext context)
{
switch (action)
{
case "Upload":
Upload(context);
break;
default:
result = new ProcessResult()
{
Result = ProcessResultType.Error,
Data = XMLHelper.GetValue("defaultNoParaInfo")
};
break;
}
}
private void Upload(HttpContext context)
{
try
{
DateTime nowTime = DateTime.Now;
string newDirectory = nowTime.ToString("yyyyMMdd/");
string path = "/Upload/";
string _filedir = context.Server.MapPath(path + newDirectory);
int cout = context.Request.Files.Count;
if (cout > 0)
{
HttpPostedFile httpFile = context.Request.Files[0];
if (httpFile != null)
{
try
{
string fileExt = Path.GetExtension(httpFile.FileName).ToLower();
string fileFilt = Paras.UploadFileFilt;
if (fileFilt.IndexOf(fileExt) <= -1)
{
result = new ProcessResult()
{
Result = ProcessResultType.Error,
Data = "支持格式:" + fileFilt
};
return;
}
//判断文件大小
int length = httpFile.ContentLength;
if (length / 1024 / 1024 > Paras.3)
{
result = new ProcessResult()
{
Result = ProcessResultType.Error,
Data = "文件过大,请上传小于3M的文件"
};
return;
}
Random rd = new Random();
string newFileName = nowTime.ToString("yyyyMMddHHmmssfff") + rd.Next(1000, 9999) + Path.GetExtension(httpFile.FileName);
if (!Directory.Exists(_filedir))
{
Directory.CreateDirectory(_filedir);
}
string fileName = _filedir + newFileName;
httpFile.SaveAs(fileName);
result = new ProcessResult()
{
Result = ProcessResultType.Success,
Data = path + newDirectory + newFileName
};
}
catch (Exception e)
{
result = new ProcessResult()
{
Result = ProcessResultType.Error,
Data = "uploadError:" + e.Message
};
}
}
}
}
catch (Exception e)
{
result = new ProcessResult()
{
Result = ProcessResultType.Error,
Data = e.Message
};
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
5、ProcessResult.cs 结果集
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
namespace WebCore
{
public class ProcessResult
{
public object Data { get; set; }
public ProcessResultType Result { get; set; }
}
public enum ProcessResultType
{
Error = -1,
Exclam = 0,
Success = 1
}
}