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;}}})();" );

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

C#上传并保存图片、加水印、生成缩略图

伴随移动设备地普及,处理图片、视频等需求也变得越来越基础,这里介绍的是图片的存储。...
  • xiaouncle
  • xiaouncle
  • 2017年02月05日 21:59
  • 958

上传图片保存并生成缩略图

过程讲解:一个springMvc的上传文件框架 1.上传文件,后台接受文件对象 2.正常将文件上传保存到服务器 3.将图片文件通过工具生成缩略图...
  • xiaoyu19910321
  • xiaoyu19910321
  • 2017年05月25日 23:36
  • 1558

PHP上传图片并生成缩略图_1

//is_uploaded_file 判断文件是否是通过HTTP POST上传的 //move_uploaded_file 将上传文件移至指定目录...
  • painstaker
  • painstaker
  • 2010年09月07日 15:58
  • 4653

Web关于图片上传,缩略图及加水印,还有一些常用的方法

Web关于图片上传,缩略图及加水印,还有一些常用的方法
  • wanlong360599336
  • wanlong360599336
  • 2015年06月24日 16:00
  • 2626

php上传图片自动生成缩略图方法函数

$file_name='C:\AppServ\www\_MG_9888.jpg'; $file_new='C:\AppServ\www\bbbb.jpg'; scal_pic($file_name,...
  • muziduoxi
  • muziduoxi
  • 2013年11月20日 15:09
  • 3520

C# 上传文件并生成缩略图

#region 上传文件并生成缩略图         ///         /// 上传文件并生成缩略图         ///         /// 上传控件         /// 上传目...
  • mss359681091
  • mss359681091
  • 2016年04月06日 14:09
  • 1134

thinkPHP上传图片以及生成缩略图

记录一下最thinkPHP上传图片的方法(Upload)和生成缩略图(Image)的方法.html页面form中必须加enctype=”multipart/form-data” ...
  • qq_22793991
  • qq_22793991
  • 2016年12月17日 17:53
  • 313

js上传图片,同时生成缩略图

转自 New Document 文件上传前台控制检测程序    body,td{font-size:12px;}        /*---...
  • whoami021
  • whoami021
  • 2014年07月06日 16:34
  • 2387

C#上传图片,同时生成缩略图

C#代码
  • ful1021
  • ful1021
  • 2014年08月14日 11:09
  • 715

php图片上传并生成缩略图

在生成图片的缩略图,比如宽和高的比例时,可以自由修改。这个类可用于配合前段的iframe表单元素,生成无刷新的上传图片,并在前段指定区域立即显示的效果。其实还可以再加一个属性,把任何服务器错误都替换成...
  • Free_Program_1314
  • Free_Program_1314
  • 2014年11月30日 16:29
  • 2309
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:FCKEditor 2.63 上传图片时,可按日期生成文件名、生成缩略图、添加水印
举报原因:
原因补充:

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