您的位置:首页 > 编程语言 > Java开发

利用struts2框架实现当用户上传图片到服务器后,再显示到前台页面中

2016-09-11 12:27 711 查看

分析:由于struts2已经集成了fileupload,而且用起来要比直接使用更加方便,所以当实现文件上传功能的时候最好选择struts2

1、开发前的准备:

导入struts2的jar包、struts.xml配置文件、同时将web.xml配置好。(此过程比较容易,这里不在说明)

2、action代码的编写(实现文件上传的功能,并转发到显示照片的页面中)

package com.xiaojie.upload;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileOutputStream;
import java.util.Date;
import java.util.Map;

import javax.servlet.ServletContext;

import org.apache.struts2.ServletActionContext;
import org.apache.struts2.interceptor.RequestAware;

import com.opensymphony.xwork2.ActionSupport;
import com.xiaojie.service.ProductService;

public class UploadAction extends ActionSupport implements RequestAware {
/**
*
*/
private static final long serialVersionUID = 1L;
private ProductService productService=new ProductService();
private File wj;
private String wjContentType;//文件类型
private String wjFileName;//文件名
private Map<String, Object> request;
private String wjName;
public String getWjName() {
return wjName;
}
public void setWjName(String wjName) {
this.wjName = wjName;
}
private String wjDesc;

public File getWj() {
return wj;
}
public void setWj(File wj) {
this.wj = wj;
}
public String getWjContentType() {
return wjContentType;
}
public void setWjContentType(String wjContentType) {
this.wjContentType = wjContentType;
}
public String getWjFileName() {
return wjFileName;
}
public void setWjFileName(String wjFileName) {
this.wjFileName = wjFileName;
}
public String getWjDesc() {
return wjDesc;
}
public void setWjDesc(String wjDesc) {
this.wjDesc = wjDesc;
}
@Override
public String execute() throws Exception {
// TODO Auto-generated method stub
//修改文件名
wjFileName=new Date().getTime()+wjFileName;
ServletContext servletContext=ServletActionContext.getServletContext();
String path=servletContext.getRealPath("/images/"+wjFileName);//文件最终要上传到的路径
FileOutputStream out=new FileOutputStream(path);
FileInputStream in=new FileInputStream(wj);
byte[]buffer=new byte[1024];
int len=0;
while((len=in.read(buffer))!=-1){
out.write(buffer,0,len);

}
out.close();
in.close();
String image="images/"+wjFileName;
request.put("image", image);
return super.execute();
}
@Override
public void setRequest(Map<String, Object> arg0) {
// TODO Auto-generated method stub
this.request=arg0;
}
}

3、文件上传页面代码和图片显示页面代码

3.1文件上传页面:

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ 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>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action="upload" method="post" enctype="multipart/form-data">
商品图片:<input type="file" name="wj"/><br>
商品名称:<input type="text" name="wjName"/>
商品描述:<input type="text" name="wjDesc"/>
<input type="submit" value="提交"/>
</form>

</body>
</html>
注意:图片会上传到你在tomcat上所部署的目录文件夹下的images文件夹下:(是不是多了一张图片?)

3.2、图片显示页面代码:

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>

<!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">
<title>Insert title here</title>
</head>
<body>
图片上传成功
<img alt="" src="${requestScope.image } " >http://localhost:8080/flieupload/${requestScope.image }
</body>
</html>

特别注意:由于用户很有可能会上传中文名称的图片,这会导致图片无法在前台页面上显示出来。这个问题怎么解决呢?

在tomcat的server.xml中加入URIEncoding="utf-8"(网页的编码是utf-8)<Connector port="8080" connectionTimeout="20000" disableUploadTimeout="true" URIEncoding="utf-8" />

如果还有什么不懂的,可以直接联系我的qq:1913284695

或者微信:fyydbc
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: