关于.net和jsp项目中fckeditro的使用
FCKeditor 在 vs2005 环境下安装功略 很简单 分四步走
一,下载FCKeditor文件
先在官方网页上下载 FCKeditor 的压缩包 和 FCKeditor 的.net 2.0核心库
[各位朋友可以先按照我的目录进行一次试做,然后再对自己的.net网站进行设置]
下载地址:FCKeditor 的压缩包
http://nchc.dl.sourceforge.net/sourceforge/fckeditor/FCKeditor_2.4.3.zip
FCKeditor 的.net 2.0核心库
http://nchc.dl.sourceforge.net/sourceforge/fckeditor/FCKeditor.Net_2.2.zip
二,解压文件,把FCK放到项目中,建立引用,添加fck控件
[解压文件到项目中]
把这两个压缩文件放在D:\FCK\
把FCKeditor.Net_2.2.zip 里的bin目录解压到D:\FCK\下
把FCKeditor_2.4.3.zip 完全解压到你用.net2005做的项目文件夹里
如果没有网站项目,你可以打开VS2005,新建网站,主目录设在D:\FckDemo\
接下来把FCKeditor_2.4.3.zip 里的fckeditor目录释放到 D:\FckDemo\下
[添加引用]
在解决方案资源管理器中右击当前项目,添加引用,把
D:\FCK\bin\Debug\FredCK.FCKeditorV2.dll引用进来
[在工具箱中添加FCKeditor的控件]
我们添加一个选项卡,取名为FCK,在其下 “选择项”,浏览到当前项目里的
D:\FckDemo\bin\FredCK.FCKeditorV2.dll,点确定
三,拖动控件到界面上,并修改FCK设置, 以及webconfig.xml中的设置
打开Default.aspx,直接把左边工具条里的fckeditor控件拖到界面中,我们
看到显示了fckeditor,在属性里改width为800,改height为500.
这个时候你想要运行调试,肯定会出错。。。。。。
那么我们先要改FCK内的设置:
解决方案资源管理器中找到fckeditor\fckconfig.js
先改FCK默认语言en为zh-cn
FCKConfig.DefaultLanguage = 'en' ;
替换为
FCKConfig.DefaultLanguage = 'zh-cn' ;
再改FCK默认上传使用的组件语言为aspx
var _FileBrowserLanguage = 'asp' ;
var _QuickUploadLanguage = 'asp' ;
替换为
var _FileBrowserLanguage = 'aspx' ;
var _QuickUploadLanguage = 'aspx' ;
最后再改项目的webconfig.xml
打开webconifg。xml, 在<appSettings>中设置两个键
<add key="FCKeditor:BasePath" value="/FckDemo/fckeditor/" />
<add key="FCKeditor:UserFilesPath" value="/FckDemo/Files/" />
FckDemo是你的项目名称,要注意
四 ,修改Default.aspx文件头部属性
将<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FckDemo.aspx.cs"
Inherits="FckDemo" %>
替换为
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FckDemo.aspx.cs"
Inherits="FckDemo" ValidateRequest="false" %>
加这一项能保证FCK在上传时不会失败
由于项目需要,研究了一下FCK的使用,本文主要说明如果在jsp环境中使用FCK的各项功能。
1:下载FCK editor包,我用的是最新的2.5版本,解压后会有fckeditor这样的一个文件夹。
2:下载FCK editor JAVA包,解压后,在wtp或eclipse等IDE开发环境中建立web项目,具体步骤略。
3:将FCK editor包中的fckeditor文件夹复制到web项目中的根目录下,这样做的好处就是fck editor的文
件非常多,如果直接将fck editor里面的内容复制到根目录,非常乱,不方便以后的升级。
4:web.xml可根据自已的需求进行修改。 我自己修改的如下:
<!-- fckeditor start -->
<servlet>
<servlet-name>Connector</servlet-name>
<servlet-class>com.fredck.FCKeditor.connector.ConnectorServlet</servlet-class>
<init-param>
<param-name>baseDir</param-name>
<param-value>/UserFiles/</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>true</param-value>
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet>
<servlet-name>SimpleUploader</servlet-name>
<servlet-class>com.fredck.FCKeditor.uploader.SimpleUploaderServlet</servlet-class>
<init-param>
<param-name>baseDir</param-name>
<param-value>/UserFiles/</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>false</param-value>
</init-param>
<init-param>
<param-name>enabled</param-name>
<param-value>true</param-value>
</init-param>
<init-param>
<param-name>AllowedExtensionsFile</param-name>
<param-value />
</init-param>
<init-param>
<param-name>DeniedExtensionsFile</param-name>
<param-
value>php|php3|php5|phtml|asp|aspx|ascx|jsp|cfm|cfc|pl|bat|exe|dll|reg|cgi</param-value>
</init-param>
<init-param>
<param-name>AllowedExtensionsImage</param-name>
<param-value>jpg|gif|jpeg|png|bmp</param-value>
</init-param>
<init-param>
<param-name>DeniedExtensionsImage</param-name>
<param-value />
</init-param>
<init-param>
<param-name>AllowedExtensionsFlash</param-name>
<param-value>swf|fla</param-value>
</init-param>
<init-param>
<param-name>DeniedExtensionsFlash</param-name>
<param-value />
</init-param>
<load-on-startup>1</load-on-startup>
</servlet>
<servlet>
<description>This is the description of my J2EE component</description>
<display-name>This is the display name of my J2EE component</display-name>
<servlet-name>PostArticle</servlet-name>
<servlet-class>servlet.PostArticle</servlet-class>
</servlet>
<servlet>
<servlet-name>action</servlet-name>
<servlet-class>org.apache.struts.action.ActionServlet</servlet-class>
<init-param>
<param-name>config</param-name>
<param-value>/WEB-INF/struts-config.xml</param-value>
</init-param>
<init-param>
<param-name>debug</param-name>
<param-value>3</param-value>
</init-param>
<init-param>
<param-name>detail</param-name>
<param-value>3</param-value>
</init-param>
<load-on-startup>0</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>Connector</servlet-name>
<url-pattern>/FCKeditor/editor/filemanager/browser/default/connectors/jsp/connector</url-
pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>SimpleUploader</servlet-name>
<url-pattern>/FCKeditor/editor/filemanager/upload/simpleuploader</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>PostArticle</servlet-name>
<url-pattern>/servlet/post</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>action</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
<!-- fckeditor end -->
5:运行项目,应该可以看到一个编辑器显示出来了。
6:下面大概说一下如何配置FCK editor。FCK editor的主要配置在fckconfig.js中。
var _FileBrowserLanguage = 'jsp' ;
var _QuickUploadLanguage = 'jsp' ;
这个是设置文件上传的相应的语言的
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;
这个是控制fck editor的样式的,还有其它两个选择,一个是office2003风格,还有一个是灰色风格的,
只需要替换上面的default即可。具体路径在web\fckeditor\editor\skins下可以找到。
FCKConfig.DefaultLanguage = 'zh-cn' ; 这个是默认支持的语言,fck editor支持好多种语言,如果不
考虑国际化的话,可以把语言文件都删掉。路径在\web\fckeditor\editor\lang,我只保留了zh-cn。
FCKConfig.TabSpaces = 8;这是设置tab键的。0为tab键不生效,1为tab键的长度为1,我设置为8。
FCKConfig.ToolbarSets["Default"];设置fck editor的工具栏,我只保留了['ImageButton']。这样速度
比较快。
FCKConfig.Keystrokes;设置fck editor里的快捷键,如果不想用户使用,注释掉就可以了。
FCKConfig.ImageDlgHideLink = true ;
FCKConfig.ImageDlgHideAdvanced = true ;设置图像上传时候的Link标签和高级标签是否显示,如果想隐
藏就设置为true。
再页面进行应用的时候的代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://fckeditor.net/tags-fckeditor" prefix="f"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort
()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP page</title>
</head>
<body>
<form action="servlet/post" method="post">
title:<input type="text" name="title"><br>
<f:editor id="content" basePath='<%=path + "/FCKeditor/"%>'
imageBrowserURL='<%=path
+
"/FCKeditor/editor/filemanager/browser/default/browser.html?
Type=Image&Connector=connectors/jsp/connector"%>'
linkBrowserURL='<%=path
+
"/FCKeditor/editor/filemanager/browser/default/browser.html?
Connector=connectors/jsp/connector"%>'
flashBrowserURL='<%=path
+
"/FCKeditor/editor/filemanager/browser/default/browser.html?
Type=Flash&Connector=connectors/jsp/connector"%>'
imageUploadURL='<%=path
+
"/FCKeditor/editor/filemanager/upload/simpleuploader?Type=Image"%>'
linkUploadURL='<%=path
+
"/FCKeditor/editor/filemanager/upload/simpleuploader?Type=File"%>'
flashUploadURL='<%=path
+
"/FCKeditor/editor/filemanager/upload/simpleuploader?Type=Flash"%>'>
</f:editor>
<input type="submit">
</form>
</body>
</html>