FCKEditor 2.63 上传图片时,可按日期生成文件名、生成缩略图、添加水印

原创 2011年01月06日 15:47:00

FCKEditor 是一款非常优秀的 HTML 在线文本编辑器,功能完善,支持多种浏览器,支持多种开发语言,开放的功能接口,是目前网络上最流行的编辑器之一,被很多网站采用。下面是我 FCKEditor 扩展功能的过程。

适用版本:FCKEditor 2.63

使用语言:C#

功能需求:上传图片时,按日期生成文件名,并给图片生成缩略图、添加水印。

下面请看具体效果:

1、界面图

 

 

2、水印图

 

制作过程可参考丫丫写的博客:如何用PS给图片添加水印

3、最后的效果

图片地址:http://www.yldt.com/UploadImage/200811/1/221725924.jpg

200811/1/221725924.jpg 表示:2008年11月,1日,22点17分+1~99999随机数

1、首先修改 HTML 文件FCKeditor/editor/dialog/fck_image.html,给表单添加相关的html控件,这样,上传图片时,可选择是否添加水印与水印的放置位置。

2、从这里开始,就要修改FredCK.FCKeditorV2.vs2005这个项目的源代码了,这是FCKEditor专门支持 .NET 而提供的开源项目,使用 GPL 协议发布。

(1)、修改FCKeditor.Net_2.6.3/FileBrowser/FileWorkerBase.cs,这个类的作用是支持文件的浏览和上传。可在此获得 System.Web.HttpRequest 对象,其中就有用户Post 过来的数据,然后根据需要使用,比如自定义文件名,对图片进一步处理等。

(2)、添加FCKeditor.Net_2.6.3/ImageProcess.cs,这个类是我自己根据需求新增的,作用是对上传的图片进一步处理。里面有两个重要的方法,分别是:

方法一:给图片增加水印,使用的是 .NET 下的图片处理功能。

/// <summary>
/// 给图片增加水印。
/// </summary>
/// <param name="stream">上传的图片流</param>
/// <param name="path">保存到的路径</param>
/// <param name="waterMarkUrl">水印地址</param>
/// <param name="corner">水印角落,如:左上角</param>
public static void AddWatermarkToImg(System.IO.Stream stream, string path, string waterMarkUrl, string corner)

方法二:该方法可以生成各种大小图片的缩略图功能,以方便在需要不同大小的页面调用。

/// <summary>
/// 生成等比缩略图
/// </summary>
/// <param name="largeImagePhysicsPath">要生成缩略图图片的物理路径,如E:/UploadImage/200811/1/221725924.jpg</param>
/// <param name="thumbnailImagePhysicsPath">生成缩略图的物理路径,如E:/SmallImage/200811/1/221725924.jpg</param>
/// <param name="fileName">原图的文件名 221725924.jpg</param>
/// <param name="smallFileName">缩略图文件名 221725924.jpg</param>
/// <param name="width">缩略图宽</param>
/// <param name="height">缩略图高</param>
/// <returns></returns>
public static void ThumbnailImage(string largeImagePhysicsPath, string thumbnailImagePhysicsPath, string fileName, string smallFileName, int width, int height)

由于各种原因代码我就不贴了,请见谅。

还有一点就是,用 IE 上传文件后无法返回,显示“没有权限”,实际上文件已经上传成功,用 FF 是可以顺利返回。估计是 IE对 javascript 脚本的document.domain 处理比较严格吧。

解决方法:修改FCKeditor.Net_2.6.3/FileBrowser/FileWorkerBase.cs,注释以下一行即可。

Response.Write( @"(function(){var d=document.domain;while (true){try{var A=window.top.opener.document.domain;break;}catch(e) {};d=d.replace(/.*?(?:/.|$)/,'');if (d.length==0) break;try{document.domain=d;}catch (e){break;}}})();" );

结束语:经过一个多月的使用,根据用户反馈,该功能效果良好,有这个需求的朋友们不妨一试。:)

相关文章推荐

上传图片生成缩略图及水印

  • 2008年05月13日 17:49
  • 404KB
  • 下载

asp.net上传图片并自动生成缩略图和给图片水印

无标题页 upfile.aspx.cs文件 using System; u...

asp.net上传图片+自动生成缩略图+图片水印功能

实现过程:选择图片上传成功后,取得已经存在服务器的文件生成缩略图,并且判断是否是图片类型的文件,这个的判断可以在程序中修改,本程序只是判断了“image/bmp”、“image/gif”、“image...

使用FileUpload控件上传图片并自动生成缩略图、自动生成带文字和图片的水印图

本文借助vs2005中自带的FileUpload控件实现图片文件的上传并生成缩略图。     实现过程:选择图片上传成功后,取得已经存在服务器的文件生成缩略图,并且判断是否是图片类型的文件,这个的判...
  • wyh0318
  • wyh0318
  • 2012年07月05日 16:12
  • 310
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:FCKEditor 2.63 上传图片时,可按日期生成文件名、生成缩略图、添加水印
举报原因:
原因补充:

(最多只允许输入30个字)