首页 > 代码库 > 如何利用”七牛云”在UEditor实现图片的上传和浏览

如何利用”七牛云”在UEditor实现图片的上传和浏览

在学习之前,我参考了朋友些的一篇关于这个功能实现的文章,非常不错。大家可以参考:http://www.cnblogs.com/John-Marnoon/p/5818528.html#3501846

里面都写了具体的实现,我也是参照朋友的文章来操作的。现在我重新整理一下实现的步骤:

1 . 注册一个七牛云用户

2.  在七牛云网站中创建一个空间来存储图片,存储区域选择 华东或是 华北,请先记得上传到华东1区的域名为up.qiniu.com、up-z0.qiniu.com和upload.qiniu.com;上传到华北1区的域名为up-z1.qiniu.com和upload-z1.qiniu.com ,后面写代码需要用到。

技术分享

3. 查看七牛云的密钥管理

技术分享

 

4. 查看空间的域名

技术分享

 

5. 修改UEditor中的 UploadHandler类的代码。实现代码如下

技术分享
using System;using System.Collections.Generic;using System.IO;using System.Linq;using System.Text.RegularExpressions;using System.Web;using Qiniu.Auth;using Qiniu.IO;using Qiniu.IO.Resumable;using Qiniu.RS;/// <summary>/// UploadHandler 的摘要说明/// </summary>public class UploadHandler : Handler{    public UploadConfig UploadConfig { get; private set; }    public UploadResult Result { get; private set; }         public UploadHandler(HttpContext context, UploadConfig config)        : base(context)    {        this.UploadConfig = config;        this.Result = new UploadResult() { State = UploadState.Unknown };    }    public override void Process()    {        byte[] uploadFileBytes = null;        string uploadFileName = null;        if (UploadConfig.Base64)        {            uploadFileName = UploadConfig.Base64Filename;            uploadFileBytes = Convert.FromBase64String(Request[UploadConfig.UploadFieldName]);        }        else        {            var file = Request.Files[UploadConfig.UploadFieldName];            uploadFileName = file.FileName;            if (!CheckFileType(uploadFileName))            {                Result.State = UploadState.TypeNotAllow;                WriteResult();                return;            }            if (!CheckFileSize(file.ContentLength))            {                Result.State = UploadState.SizeLimitExceed;                WriteResult();                return;            }            uploadFileBytes = new byte[file.ContentLength];            try            {                file.InputStream.Read(uploadFileBytes, 0, file.ContentLength);            }            catch (Exception)            {                Result.State = UploadState.NetworkError;                WriteResult();            }        }        Result.OriginFileName = uploadFileName;        DateTime today = DateTime.Today;        string qiNiuFileName =   "upload/" + today.Year + "/" + today.Month + "/" + today.Day + "/" + RuPengCommons.CommonHelper.CalcMD5(uploadFileBytes) + Path.GetExtension(uploadFileName);          //    var savePath = PathFormatter.Format(uploadFileName, UploadConfig.PathFormat);     //   var localPath = Server.MapPath(savePath);        try        {        //    if (!Directory.Exists(Path.GetDirectoryName(localPath)))        //    {        //        Directory.CreateDirectory(Path.GetDirectoryName(localPath));        //    }        //    File.WriteAllBytes(localPath, uploadFileBytes);        //    Result.Url = savePath;        //    Result.State = UploadState.Success;            Qiniu.Conf.Config.ACCESS_KEY = "MUahZ72rD1AMFaLqKBk0I382FSVVWib8ArK-7oKP";            Qiniu.Conf.Config.SECRET_KEY = "mi3P4qzsfXiHJ7Rr9wwCBH7smRHQabpRnEFeDIuw";             //上传域名为:上传到华东1区的域名为up.qiniu.com、up-z0.qiniu.com和upload.qiniu.com;上传到华北1区的域名为up-z1.qiniu.com和upload-z1.qiniu.com             Qiniu.Conf.Config.UP_HOST = "http://up-z1.qiniu.com";            IOClient target = new IOClient();            PutExtra extra = new PutExtra();            //设置上传的空间            String bucket = "tupian";            //设置上传的文件的key值            String key = qiNiuFileName;            //普通上传,只需要设置上传的空间名就可以了,第二个参数可以设定token过期时间            PutPolicy put = new PutPolicy(bucket, 3600);                         //调用Token()方法生成上传的Token            string upToken = put.Token();            //上传文件的路径            MemoryStream ms = new MemoryStream(uploadFileBytes);                       //调用PutFile()方法上传            // PutRet ret = target.PutFile(upToken, key, filePath, extra);            PutRet ret = target.Put(upToken, key,ms, extra);            Result.Url = "http://od6b842wn.bkt.clouddn.com/" + qiNiuFileName;                       Result.State = UploadState.Success;        }        catch (Exception e)        {            Result.State = UploadState.FileAccessError;            Result.ErrorMessage = e.Message;        }        finally        {            WriteResult();        }    }    private void WriteResult()    {        this.WriteJson(new        {            state = GetStateMessage(Result.State),            url = Result.Url,            title = Result.OriginFileName,            original = Result.OriginFileName,            error = Result.ErrorMessage        });    }    private string GetStateMessage(UploadState state)    {        switch (state)        {            case UploadState.Success:                return "SUCCESS";            case UploadState.FileAccessError:                return "文件访问出错,请检查写入权限";            case UploadState.SizeLimitExceed:                return "文件大小超出服务器限制";            case UploadState.TypeNotAllow:                return "不允许的文件格式";            case UploadState.NetworkError:                return "网络错误";         }        return "未知错误";    }    private bool CheckFileType(string filename)    {        var fileExtension = Path.GetExtension(filename).ToLower();        return UploadConfig.AllowExtensions.Select(x => x.ToLower()).Contains(fileExtension);    }    private bool CheckFileSize(int size)    {        return size < UploadConfig.SizeLimit;    }}public class UploadConfig{    /// <summary>    /// 文件命名规则    /// </summary>    public string PathFormat { get; set; }    /// <summary>    /// 上传表单域名称    /// </summary>    public string UploadFieldName { get; set; }    /// <summary>    /// 上传大小限制    /// </summary>    public int SizeLimit { get; set; }    /// <summary>    /// 上传允许的文件格式    /// </summary>    public string[] AllowExtensions { get; set; }    /// <summary>    /// 文件是否以 Base64 的形式上传    /// </summary>    public bool Base64 { get; set; }    /// <summary>    /// Base64 字符串所表示的文件名    /// </summary>    public string Base64Filename { get; set; }}public class UploadResult{    public UploadState State { get; set; }    public string Url { get; set; }    public string OriginFileName { get; set; }    public string ErrorMessage { get; set; }}public enum UploadState{    Success = 0,    SizeLimitExceed = -1,    TypeNotAllow = -2,    FileAccessError = -3,    NetworkError = -4,    Unknown = 1,}
View Code

 

 技术分享

6. 在后台的UEditor上传图片

技术分享

7. 在后台保存成功后,在前台预览

技术分享

8.七牛云的C# SDK 使用指南和下载地址

http://developer.qiniu.com/code/v6/sdk/csharp.html

技术分享

 

如何利用”七牛云”在UEditor实现图片的上传和浏览