FCKeditor 2.6.6的jsp使用

废话不多说,都是我个人的搭建步骤,仅供参考

 

1. 下载FCKeditor_2.6.6.zip、fckeditor-java-2.6-bin.zip、fckeditor-java-2.6-src.zip(要修改源码)、fckeditor-java-demo-2.6.war。

 

2.把FCKeditor_2.6.6.zip解压到WebRoot下;把commons-fileupload-1.2.1.jar、commons-io-1.3.2.jar、imageinfo-1.9.jar、java-core-2.6.jar、slf4j-api-1.5.8.jar、slf4j-simple-1.5.8.jar(这些jar包可以从war中获得)放到WEB-INF的lib下;把fckeditor.properties(可以从war中获得或是参考文档)放到src中。

 

3.编写fckeditor_index.jsp:(我用的是jsp标签的方式,还有javascript的方式,网上很多)

 

<%@ page language="java" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.fckeditor.net" prefix="FCK" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Insert title here</title>
		<script type="text/javascript">
</script>
	</head>
	<body>
		<form action="fckeditor_index.jsp" method="post">
			<FCK:editor instanceName="MyFCKeditor" basePath="/fckeditor" value=" " toolbarSet="myToolbar"></FCK:editor>
			<input type="submit" value="提交" />
		</form>
		<%
		request.setCharacterEncoding("utf-8");
		String myFCKeditor=request.getParameter("MyFCKeditor");   %>
		<%=myFCKeditor %>
	</body>
</html>
 

4.编写myconfig.js放在fckeditor目录下

 

FCKConfig.DefaultLanguage = 'zh-cn' ;
FCKConfig.FontNames	= '宋体;楷体;隶书;黑体;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;
FCKConfig.EnterMode = 'br' ;			// p | div | br
FCKConfig.ShiftEnterMode = 'p' ;	// p | div | br
FCKConfig.ToolbarSets["myToolbar"] = [
	['Source','DocProps','-','Save','NewPage','Preview','-','Templates'],
	['Cut','Copy','Paste','PasteText','PasteWord','-','SpellCheck'],
	['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
	['Form','Checkbox','Radio','TextField','Textarea','Select','Button','ImageButton','HiddenField'],
	'/',
	['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
	['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote','CreateDiv'],
	['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
	['Link','Unlink','Anchor'],
	['Image','Flash','Table','Rule','Smiley','SpecialChar','PageBreak'],
	'/',
	['Style','FontFormat','FontName','FontSize'],
	['TextColor','BGColor'],
	['FitWindow','ShowBlocks','-','About']		// No comma for the last row.
] ;

 

5.修改fckconfig.js中的

 

FCKConfig.CustomConfigurationsPath = FCKConfig.EditorPath + 'myconfig.js' ;

 

6.web.xml中加入(net.fckeditor.connector.ConnectorServlet是后面要改的)

 

<servlet>
		<servlet-name>ConnectorServlet</servlet-name>
		<servlet-class>net.fckeditor.connector.ConnectorServlet</servlet-class>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>ConnectorServlet</servlet-name>
		<url-pattern>
        /fckeditor/editor/filemanager/connectors/*
      </url-pattern>
	</servlet-mapping>
 

7.运行应该可以看到fckeditor的编辑界面了,但这时上传文件中如果含有中文或是建立中文名的目录都会有乱码或是中文名文件无法用到,就要修改源码了。

 

8.在src中建立三个java文件:

com.wujay.ConnectorServlet.java与java-core-2.6.jar中net.fckeditor.connector.ConnectorServlet.java基本一样,只是其中的Dispatcher引用的是下面改版的:

com.wujay.Dispatcher.java与java-core-2.6.jar中net.fckeditor.connector.Dispatcher.java基本一样,只是在doGet方法中的

 

if (command.equals(Command.CREATE_FOLDER)) {
						String newFolderNameStr = request.getParameter("NewFolderName");

 

 后加上一句

 

newFolderNameStr = new String(newFolderNameStr.getBytes("iso8859-1"), "utf-8");

 

 在doPost方法中的

 

String fileName = FilenameUtils.getName(uplFile.getName());
				logger.info("Parameter NewFile: {}", fileName);

 

 后加上

 

String extension = FilenameUtils.getExtension(fileName);
				StringBuffer fileRandomName=new StringBuffer();
				fileRandomName.append(DateAndUuidName.generateName()).append(".").append(extension);
				fileName=fileRandomName.toString();

 

 com.wujay.DateAndUuidName.java如下:

 

/**
 * 生成当前时间和UUID的结合字符串
 * @author wujay
 */
public class DateAndUuidName {
	public static String generateName() {
		String date = new SimpleDateFormat("yyyyMMddHHmmss").format(Calendar.getInstance().getTime());
		String uuidStr=UUID.randomUUID().toString();
		StringBuffer temp = new StringBuffer();
		temp.append(date).append('_').append(uuidStr);
		return temp.toString();
	}
}

 修改web.xml中的net.fckeditor.connector.ConnectorServlet为我刚写的com.wujay.ConnectorServlet。

 

9.OK了! 不怕中文了哈哈

 

10.今天看到了pinyin4j的东西,可以写个FileNameHelper类把上传的文件名中的汉字改成拼音,也可以解决问题,比UUID看上去直观些

/**
 * 生成当前时间和文件名汉字转拼音的结合字符串
 * 
 * @author wujay
 */
public class FileNameHelper {
	public String switchName(String fileName) throws BadHanyuPinyinOutputFormatCombination {
		String date = new SimpleDateFormat("yyyyMMddHHmmss").format(Calendar.getInstance().getTime());
		String newFileName = getPinYin(fileName);
		StringBuffer temp = new StringBuffer();
		temp.append(date).append('_').append(newFileName);
		return temp.toString();
	}

	// 如果有中文则把中文转化成拼音
	public String getPinYin(String zhongWen) throws BadHanyuPinyinOutputFormatCombination {
		String zhongWenPinYin = "";
		char[] chars = zhongWen.toCharArray();

		for (int i = 0; i < chars.length; i++) {
			String[] pinYin = PinyinHelper.toHanyuPinyinStringArray(chars[i], getDefaultOutputFormat());
			// 当转换不是中文字符时,返回null
			if (pinYin != null) {
				zhongWenPinYin += capitalize(pinYin[0]);
			} else {
				zhongWenPinYin += chars[i];
			}
		}

		return zhongWenPinYin;
	}

	// 输出格式
	public HanyuPinyinOutputFormat getDefaultOutputFormat() {
		HanyuPinyinOutputFormat format = new HanyuPinyinOutputFormat();
		format.setCaseType(HanyuPinyinCaseType.LOWERCASE);// 小写
		format.setToneType(HanyuPinyinToneType.WITHOUT_TONE);// 有音调数字
		format.setVCharType(HanyuPinyinVCharType.WITH_V);// u显示成v
		return format;
	}

	// Capitalize 首字母大写
	public static String capitalize(String s) {
		char ch[] = s.toCharArray();
		if (ch[0] >= 'a' && ch[0] <= 'z') {
			ch[0] = (char) (ch[0] - 32);
		}
		return new String(ch);
	}
}
 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
如何配置: 基本的比如路径、toolbar等这些东西网上很多,我就不写了~主要说下对已上传文件管理部分的配置。 1.首先打开包中editor/filemanager/connectors/php目录下的config.php文件,有如下部分: view source print? 1 $Config['MysqlHost'] = 'localhost'; 2 $Config['MysqlUserName'] = 'root'; 3 $Config['MysqlPW'] = ''; 4 $Config['MysqlDBName'] = 'test'; 5 $Config['TableName'] = 'attachments'; 6 $Config['OwnerVarType'] = 'COOKIE'; //only SESSION or COOKIE 7 $Config['OwnerVarName'] = 'ownerid'; 相信大家一看都知道是什么些了吧~这里说下后三个是什么东东~ view source print? 1 $Config['TableName'] //在数据库中附件表的表名 view source print? 1 $Config['OwnerVarType'] 2 $Config['OwnerVarName'] 这两个是一起的。因为我们写的文章都要有一个ID,也就是唯一标志的~这里通过这两个设置告诉fck在php中哪个变量是当前编辑文章的ID。 $Config['OwnerVarType']只能设置为COOKIE或SESSION,表示文章ID是存在COOKIE中的还是SESSION中的。这里建议大家用SESSION,因为COOKIE的话,可能存在一个cookie欺骗哦~ $Config['OwnerVarName']表示你设置的COOKIE或者SESSION的变量名字。比如你存的是$_COOKIE['ownerid']。那么,就是上面的默认设置。 view source print? 1 $Config['AllowedExtensions']['File'] 2 $Config['AllowedExtensions']['Image'] 3 $Config['AllowedExtensions']['Flash'] 这三个变量是设置你允许上传的文件类型,和已上传文件管理功能也密切相关的哈~ 2.设置好上面的文件以及fck的基本设置之后,请首先运行editor/filemanager/connectors/php目录下的create_db_table.php文件,确保附件表已经创建。 3.enjoy it~ 如果有bug,或不能正常使用,欢迎指正哈~
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值