FCKeditor 2.6.6的jsp应用 _JavaScript

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