fckeditor具体使用步骤2

来源：互联网发布：离散数学考研知乎编辑：程序博客网时间：2024/06/05 04:18

( 接fckeditor使用步骤1)

基本的步骤整合好之后，还有艰巨的任务就是要修改fckeditor上传图片，文件的内容了

主要就是要解决几个问题：

1，上传中文名字的文件，图片

2，引用中文名字的文件，图片

3，创建中文名字的文件夹

4，上传文件的扩展名的修改

5，文件上传的大小限制

第一步

在web.xml中配置一个fck的servlet：

<servlet-name>Connector</servlet-name>

<servlet-class>

           net.fckeditor.connector.ConnectorServlet

</servlet-class>

<load-on-startup>1</load-on-startup>

</servlet>

<servlet-mapping>

<servlet-name>Connector</servlet-name>

<url-pattern>

/fckeditor/editor/filemanager/connectors/*

</url-pattern>

</servlet-mapping>

第二步

在类目录下，也就是src下建立一个属性文件，fckeditor.properties 名字不要改

文件里面写入：

connector.userActionImpl=net.fckeditor.requestcycle.impl.UserActionImpl

第三步

将fckeditor的源文件关联起来，fckeditor-java-2.4.2-src.zip

建一个类：ConnectorServlet.class

找到ReferencedLibraries/java-core-2.4.2.jar/net.fckeditor.connector/ConnectorServlet.class

打开后将里面的代码全部复制到刚才建立的那个类下面，同时要修改web.xml里面的

<servlet-class>新建的这个类的地址</servlet-class>：

因为文件上传是用的servlet中的post方法 ctrl+O 找到doPost方法，然后

。。。

try {

List<FileItem> items =upload.parseRequest(request);

// We upload onlyone file at the same time

FileItem uplFile = items.get(0);

StringrawName = UtilsFile.sanitizeFileName(uplFile.getName());

String filename = FilenameUtils.getName(rawName);

String baseName = FilenameUtils.removeExtension(filename);

String extension = FilenameUtils.getExtension(filename);

//增加这句代码，解决了中文文件上传已经引用中文文件的问题

filename = UUID.randomUUID()+"."+extension;

if (!ExtensionsHandler.isAllowed(resourceType,extension))

ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION);

elseif(uplFile.getSize()> 100*1024){

ur= new UploadResponse(204);

}

。。。。

第四步

解决上传文件的大小的问题
因为文件上传是用的servlet中的post方法 ctrl+O 找到doPost方法，然后修改

。。。

try {

List<FileItem> items =upload.parseRequest(request);

// We upload onlyone file at the same time

FileItem uplFile = items.get(0);

StringrawName = UtilsFile.sanitizeFileName(uplFile.getName());

String filename = FilenameUtils.getName(rawName);

String baseName = FilenameUtils.removeExtension(filename);

String extension = FilenameUtils.getExtension(filename);

filename = UUID.randomUUID()+"."+extension;

if (!ExtensionsHandler.isAllowed(resourceType,extension))

ur = new UploadResponse(UploadResponse.SC_INVALID_EXTENSION);

//这里解决了文件上传的大小问题

elseif(uplFile.getSize()> 100*1024){

ur= new UploadResponse(204);

}

。。。。

对于这里的204是自己定义的错误码，需要在页面定义提示的内容，这句话应该在哪里提示呢？

文件上传应该是在上传的时候判断文件的大小，所以我们浏览服务器àupload按钮所在区域à点击鼠标右键à属性à查看地址à找到相应的页面（）(http://127.0.0.1:8081/fckeditorPractice/fckeditor/editor/filemanager/browser/default/frmupload.html)

在页面找到（增加红色字的错误码）：

switch ( errorNumber )

{

case 0 :

window.parent.frames['frmResourcesList'].Refresh() ;

break ;

case 1 : // Custom error.

alert( data ) ;

break ;

case 201 :

window.parent.frames['frmResourcesList'].Refresh() ;

alert( 'A file with thesame name is already available. The uploaded file has been renamed to "' + data +'"' ) ;

break ;

case 202 :

alert( 'Invalid file' ) ;

break ;

case 204 :

alert("Thefile is too big");

break;

default :

alert( 'Error on fileupload. Error number: '+ errorNumber ) ;

break ;

}

第五步

解决建立中文文件夹的方法，就是找到doGet方法：

else if (command.equals(CommandHandler.CREATE_FOLDER)) {

String tempFolderStr =

//修改部分

request.getParameter("NewFolderName");

tempFolderStr= new String(tempFolderStr.getBytes("iso-8859-1"),"utf-8");

StringnewFolderStr = UtilsFile.sanitizeFolderName(tempFolderStr);

logger.debug("ParameterNewFolderName: {}", newFolderStr);

File newFolder = new File(currentDir, newFolderStr);

int errorNumber = XmlResponse.EN_UKNOWN;

if (newFolder.exists())

errorNumber = XmlResponse.EN_ALREADY_EXISTS;

else {

try {

errorNumber = (newFolder.mkdir()) ?XmlResponse.EN_OK

: XmlResponse.EN_INVALID_FOLDER_NAME;

} catch (SecurityException e) {

errorNumber = XmlResponse.EN_SECURITY_ERROR;

}

但是我发现建立的虽然这样可以解决建立中文文件夹，但是打开中文文件夹会报错，引用中文文件夹中的文件会出错

针对这种情况，我们可以不让用户建立中文文件夹：

在浏览服务器àcreate new Folderà点击鼠标右键à属性à”地址”相应的页面àhttp://127.0.0.1:8081/fckeditorPractice/fckeditor/editor/filemanager/browser/default/frmcreatefolder.html

修改的地方为红色的部分：

function CreateFolder()

{

var sFolderName ;

while ( true )

{

sFolderName = prompt( 'Type the name of the new folder:', '' ) ;

var patrn= /^[a-zA-Z0-9]+$/;

if ( sFolderName == null )

return ;

else if ( !patrn.exec( sFolderName ) )

alert( 'Notto support Chinese name' ) ;

else if ( sFolderName.length == 0 )

alert( 'Please type thefolder name') ;

else

break ;

}

oConnector.SendCommand( 'CreateFolder','NewFolderName=' + encodeURIComponent( sFolderName) , CreateFolderCallBack ) ;

}

第六步

解决上传文件扩展名的问题，在用些情况下，需要对上传的文件的类型进行限制或者增加

解决这个问题，需要修改服务器上的文件上传类型以及客户端的文件上传类型，注意，客户端和服务器上的要一致

·服务器：

找到Referenced Librariesàjava-core-2.4.2.jarànet.fckeditor.handlersàdefault.properties

复制里面的

connector.resourceType.file.extensions.allowed = ..

connector.resourceType.image.extensions.allowed= ..

connector.resourceType.flash.extensions.allowed= ..

connector.resourceType.media.extensions.allowed = ..

到类文件下的 fckeditor.properties中，然后修改自己需要配置的文件类型：如

connector.resourceType.file.extensions.allowed= bmp|doc|docx|gif|jpeg|jpg|pdf|png|ppt|rar|swf|txt|xls|zip

·客户端：（以上传文件为例，图片，视频是一样的）

从fckconfig.js中找到

FCKConfig.LinkUploadAllowedExtensions = ".(bmp|doc|docx|gif|jpeg|jpg|pdf|png|ppt|rar|swf|txt|xls|zip)$";

复制到myconfig.js中

如果需要用到这个myconfig.js，就在实例化对象的时候引用这个配置文件

第七步

全部上传的设置就设置完了，但是还有些小地方需要设置一下，

比如在在上传图片的时候，预览区里面的那段英文文字想换掉或者不想让客户端来浏览服务器的内容

这些都需要来设置：

1，去掉预览区的英文：

跟上面的方法一样，在预览区点击属性找到相应的页面：

http://127.0.0.1:8081/fckeditorPractice/fckeditor/editor/dialog/fck_image/fck_image_preview.html，

然后在页面里面找到那段文字，去掉即可

2，去掉浏览服务器上的内容的按钮（以上传图片为例）

找到相应的页面

http://127.0.0.1:8081/fckeditorPractice/fckeditor/editor/dialog/fck_image.html

注释掉下面这个按钮即可

<!--

<input id="btnBrowse"onclick="BrowseServer();" type="button" value="BrowseServer"

fcklang="DlgBtnBrowseServer"/>

</td>-->