grails中使用FCK插件的小结

适用fckeditor插件版本0.8->0.93

安装插件：grails install-plugin fckeditor

1. 配置插件：
在config.groovy中添加如下代码
fckeditor {
upload {
basedir = "/uploads/"
overwrite = false
link {
browser = true
upload = false
allowed = []
denied = ['html', 'htm', 'php', 'php2', 'php3', 'php4', 'php5',
'phtml', 'pwml', 'inc', 'asp', 'aspx', 'ascx', 'jsp',
'cfm', 'cfc', 'pl', 'bat', 'exe', 'com', 'dll', 'vbs', 'js', 'reg',
'cgi', 'htaccess', 'asis', 'sh', 'shtml', 'shtm', 'phtm']
}
image {
browser = true
upload = true
allowed = ['jpg', 'gif', 'jpeg', 'png']
denied = []
}
flash {
browser = false
upload = false
allowed = ['swf']
denied = []
}
media {
browser = false
upload = false
allowed = ['mpg', 'mpeg', 'avi', 'wmv', 'asf', 'mov']
denied = []
}
}
}
最后，会生成一个upload目录在工程的web-app的目录下，该目录用于放置上传的文件。该配置文件可根据实际情况自行配置。

2. 图片表情等弹出问题：是因为css冲突的缘故，修改main.css文件中.bady样式为
.body {
margin: 0 15px 10px 15px;
}

3. 将新闻内容字段设置成text类型后可上传很多图片以及文字，数据库以mysql为例
例如：
class CompanyNews
{
String title
String content
Date time

static constraints = {
title (blank:false)
content (blank:false,type:'text')
}

}
如果数据库中对应的表还是varchar可手动修改成text

4. fck标签的使用
例如：在create.gsp页面中
<td valign="top" class="value ${hasErrors(bean:companyNewsInstance,field:'content','errors')}">
<fckeditor:editor id='content' name='content' height="400" >${companyNewsInstance.content}</fckeditor:editor>
</td>
在show.gsp页面
<tr class="prop">
<td valign="top" class="name">内容:</td>
<td valign="top" class="value">${companyNewsInstance.content.decodeHTML()}</td>

</tr>

5. 获取新闻内容中的第一张图片
因为获取新闻内容是采用${companyNewsInstance.content.decodeHTML()}的方法，主要是decodeHTML()方法。
我采用的方式是自定义codec

import java.util.regex.Matcher
import java.util.regex.Pattern

/**
 *
 * @author Tony shen
 */
class CustomerCodec {
    static decode = { theTarget ->
    	theTarget.decodeHTML()
        def pattern= ~"/uploads/Image/[([a-z0-9]|.|/|\\-)]+.[(jpg)|(bmp)|(gif)|(png)]"
        Matcher matcher = pattern.matcher(theTarget)
        def out = new ArrayList()
        while(matcher.find()){
            out << matcher.group()
        }
        theTarget = out[0]
    }

}

在前台页面中调用方式：
<image src="${companyNewsInstance.content.decodeCustomer()}"/>即可获取新闻内容中首张图片

6. 解决标题过长的办法
还是采用自定义Codec

/**
 *
 * @author Tony Shen
 */
class TitleCodec {
    static decode = { theTarget ->
        if (theTarget.length() >6 )
           theTarget=theTarget.substring(0,6)+"..."
        theTarget = theTarget
    }
}

当标题字数超过6个字时，截取前六个字加上“…”
在前台页面中调用方式：
${companyNewsInstance.title.decodeTitle()}