jsp实现文件上传预览功能

本帖最后由 godric_star 于 2015-08-13 12:43:36 编辑

源程序实现图片格式转换的功能，具体为上传一bmp或x文件，将其转换为x或bmp格式文件并且提供下载，该功能已实现，但又要求实现上传图片预览功能，即把上传的bmp文件或转换后的bmp文件显示在网页中。特来求教jsp中如何实现，具体点的话是src后路径如何编写。

附上程序部分代码：

servlet部分代码：(说明：文件上传到路径/WEB-INF/upload下，转换结果也保存在此目录下，因此主要为读取文件路径以及文件名称)

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//得到上传文件的保存目录，将上传的文件存放于WEB-INF目录下，不允许外界直接访问，保证上传文件的安全
String savePath = getServletContext().getRealPath("/WEB-INF/upload");
File file = new File(savePath);
//判断上传文件的保存目录是否存在
if (!file.exists() && !file.isDirectory()) {
System.out.println(savePath+"目录不存在，需要创建");
file.mkdir(); //创建目录
}
String message = ""; //消息提示
try{
//使用Apache文件上传组件处理文件上传步骤：
//1、创建一个DiskFileItemFactory工厂
DiskFileItemFactory factory = new DiskFileItemFactory();
//2、创建一个文件上传解析器
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setHeaderEncoding("UTF-8"); //解决上传文件名的中文乱码
//3、判断提交上来的数据是否是上传表单的数据
if(!ServletFileUpload.isMultipartContent(request)){
return; //按照传统方式获取数据
}
//4、使用ServletFileUpload解析器解析上传数据，解析结果返回的是一个List集合，每一个FileItem对应一个Form表单的输入项
List list = upload.parseRequest(request);
for(FileItem item : list){
String filename = item.getName(); //得到上传的文件名称
if(filename==null || filename.trim().equals("")){
continue;
}
//处理获取到的上传文件的文件名的路径部分，只保留文件名部分
String Filename = filename.substring(filename.lastIndexOf("\\")+1);
//处理获取到的上传文件的文件名的路径部分，只保留文件名不含扩展名部分
String FilenameWithoutExtension = Filename.substring(0,Filename.lastIndexOf("."));
//处理获取到的上传文件的文件名的路径部分，只保留文件扩展名
String FilenExtensionName = Filename.substring(Filename.lastIndexOf(".")+1);
InputStream in = item.getInputStream(); //获取item中的上传文件的输入流
FileOutputStream out = new FileOutputStream(savePath + "\\" + Filename); //创建一个文件输出流
byte buffer[] = new byte[1024]; //创建一个缓冲区
int len = 0; //判断输入流中的数据是否已经读完的标识
//循环将输入流读入到缓冲区当中，(len=in.read(buffer))>0就表示in里面还有数据
while((len=in.read(buffer))>0){
//使用FileOutputStream输出流将缓冲区的数据写入到指定的目录(savePath + "\\" + XYFilename)当中
out.write(buffer, 0, len);
}
in.close(); //关闭输入流
out.close(); //关闭输出流
item.delete(); //删除处理文件上传时生成的临时文件
jsp部分：
上传文件：

    

------解决思路----------------------

tomcat 解析很慢的。

推荐 nginx 对静态文件直接返回：

# 静态请求本地处理

location / {
root        ..../WEB-INF/upload;
index        index.html;
}

db 存放图片相对路径，

至于静态页面直接放从 db 取出来的该路径即可。

注意控制好 nginx 用户和 tomcat 用户的访问权限。

------解决思路----------------------

你是一下   我测试通过了

$(function(){
var ei = $("#large");
ei.hide();
$("#img1").mousemove(function(e){
                ei.css({top:e.pageY,left:e.pageX}).html('').show();
}).mouseout( function(){
ei.hide("slow");
})
$("#f1").change(function(){
$("#img1").attr("src","file:///"+$("#f1").val());
})
});
#large{position:absolute;display:none;z-index:999;}