使用ckeditor+struts2+freemaker的图片上传
在网上阅读了很多同志的资料...加上自己进段时间要开发新闻模块..下面就贴出例子
首先这个例子是采用ckeditor和Struts2实现的图片上传
这里先要把必须的包添加进来
然后是写ckeditor的测试页: test.html
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<link rel="stylesheet" type="text/css" href="ckeditor/contents.css"/>
<style type="text/css">
* {
font-family: "宋体";
font-size: 14px
}
</style>
<title>CKEditor Testing</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="ck">
<table width="650" height="400" border="0" align="center">
<tr>
<td><textarea cols="80" id="content" name="content"></textarea>
<script type="text/javascript">
CKEDITOR.replace('content',addUploadButton(this));
function addUploadButton(editor) {
CKEDITOR.on('dialogDefinition', function( ev ){
var dialogName = ev.data.name;
var dialogDefinition = ev.data.definition;
if ( dialogName == 'image' ){
var infoTab = dialogDefinition.getContents( 'info' );
infoTab.add({
type : 'button',
id : 'upload_image',
align : 'center',
label : '上传',
onClick : function( evt ){
var thisDialog = this.getDialog();
var txtUrlObj = thisDialog.getContentElement('info', 'txtUrl');
var txtUrlId = txtUrlObj.getInputElement().$.id;
addUploadImage(txtUrlId);
}
}, 'browse'); //place front of the browser button
}
});
}
function addUploadImage(theURLElementId) {
//var uploadUrl = "uploadFiles.jsp";
//var imgUrl = window.open('uploadFiles.jsp','_blank');
var imgUrl = window.showModalDialog("uploadFiles.jsp");
alert(imgUrl);
//var urlObj = document.getElementById(theURLElementId);
// urlObj.value = imgUrl;
// urlObj.fireEvent("onchange");
}
</script></td>
</tr>
<tr>
<td><input type="submit" name="Submit" value="提交" />
<input type="reset" name="Reset" value="重置" /></td>
</tr>
</table>
</form>
</body>
</html>
再写struts.xml文件:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
<struts>
<!--
<constant name="struts.devMode" value="true" />
-->
<package name="index" extends="struts-default">
<action name="ck" class="com.lee.action.CKAction" >
<result name="success" type="freemarker">freemarker/ck.ftl</result>
</action>
<!--
<action name ="fileUpload" class ="com.lee.action.MyUploadAction" >
<interceptor-ref name ="fileUploadStack" />
<result name ="success">/testStrutsView.jsp </result >
</action >
-->
<action name ="fileUpload" class ="com.lee.action.MyUploadAction2" >
<interceptor-ref name ="fileUploadStack" />
<result name ="success">uploadFiles.jsp </result >
</action >
</package>
</struts>
写Action类:
package com.lee.action;
import java.io.BufferedInputStream;
import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.io.InputStream;
import java.io.OutputStream;
import java.util.Date;
import javax.servlet.http.HttpServletRequest;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.Action;
import com.opensymphony.xwork2.ActionSupport;
public class MyUploadAction2 extends ActionSupport {
private static final long serialVersionUID = 572146812454l ;
private static final int BUFFER_SIZE = 16 * 1024 ;
private File myFile;
private String contentType;
private String fileName;
private String imageFileName;
private String pagePath;
public String getPagePath() {
return pagePath;
}
public void setPagePath(String pagePath) {
this.pagePath = pagePath;
}
public void setMyFileContentType(String contentType) {
this .contentType = contentType;
}
public void setMyFileFileName(String fileName) {
this .fileName = fileName;
}
public void setMyFile(File myFile) {
this .myFile = myFile;
}
public String getImageFileName() {
return imageFileName;
}
public static void copy(File src,File dst) {
try {
InputStream in = null ;
OutputStream out = null ;
try {
in = new BufferedInputStream( new FileInputStream(src), BUFFER_SIZE);
out = new BufferedOutputStream( new FileOutputStream(dst), BUFFER_SIZE);
byte [] buffer = new byte [BUFFER_SIZE];
while (in.read(buffer) > 0 ) {
out.write(buffer);
}
} finally {
if ( null != in) {
in.close();
}
if ( null != out) {
out.close();
}
}
} catch (Exception e) {
e.printStackTrace();
}
}
private static String getExtention(String fileName) {
int pos = fileName.lastIndexOf(".");
return fileName.substring(pos);
}
public String execute() {
imageFileName = "mypic_"+fileName;
pagePath = "ckeditor/images/Image/"+ imageFileName;
File imageFile = new File(ServletActionContext.getServletContext().getRealPath( "/ckeditor/images/Image" ) + "/" + imageFileName);
copy(myFile, imageFile);
return Action.SUCCESS;
}
}
上面的是图片的上传类:
下面是图片上传页面:
uploadFiles.jsp
<%@ page language="java" contentType="text/html; charset=GB18030"
pageEncoding="GB18030"%>
<%@ page import="java.text.*" %>
<%@ page import="java.util.*" %>
<%@page import="com.opensymphony.xwork2.ActionContext"%>
<%@ taglib prefix = "s" uri = "/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns ="http://www.w3.org/1999/xhtml" >
<head>
<%
String name = (String)request.getAttribute("imageFileName");
String pagename = (String)request.getAttribute("pagePath");
if(name != null){
System.out.println(name);
System.out.println(pagename);
out.println("上传成功");
}
%>
</head>
<body>
<form action="fileUpload" method="POST" name="pos" enctype="multipart/form-data" >
<table width="80%" border="1" cellspacing="0" cellpadding="0">
<tr>
<s:file name="myFile"></s:file>
</tr>
</table>
<input type="submit" value="上传">
</form>
<input type="text" id="name2" width="90%" value="<%=pagename %>">
</body>
<script type="text/javascript">
var nameid = document.getElementById("name2").value;
if(nameid!="null"){
alert("你传递的参数是: "+nameid);
window.returnValue=nameid;
}
</script>
</html>
接着是写一个Action负责把FreeMaker的处理:
package com.lee.action;
import com.lee.model.TextArea;
import com.opensymphony.xwork2.Action;
import com.opensymphony.xwork2.ActionSupport;
public class CKAction extends ActionSupport {
private String content;
TextArea tx = new TextArea();
public TextArea getTx() {
return tx;
}
public void setTx(TextArea tx) {
this.tx = tx;
}
public String execute() {
tx.setContent(this.getContent());
return Action.SUCCESS;
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
}