黑马程序员技术交流社区

标题: 图片上传 [打印本页]

作者: wyy283    时间: 2013-7-25 11:19
标题: 图片上传
本帖最后由 杨兴庭 于 2013-7-25 23:14 编辑

请高人解释下图片上传的详细过程,越通俗越简单越好。谢谢

作者: 深圳在漂移    时间: 2013-7-25 11:34
页面允许用户选择要上传的图片并提交,后台在用户提交之后应该做两件事情:一是将该用户提交的图片路径保存在部署好的服务器端,二是将该路径保存在数据库中。如此一来,再下一次调用的时候就可以依照数据库中保存的图片路径在服务器端找到该图片并使用。
作者: 张强1    时间: 2013-7-25 11:38
这是一个简单的例子,最简单的学习方法就是读代码,看懂别人的思路你就懂了,希望对你有帮助
前台页面:
<!--注意enctype表明设置表单的MIME编码。默认情况,这个编码格式是application/x-www-form-urlencoded,不能用于文件上传;只有使用了multipart/form-data,才能完整的传递文件数据,进行下面的操作.-->
<form id="addform" method="post" enctype="multipart/form-data" action="${base}/action/addPhoPic">
<table border="0" class="perview" align="center">
        <a href="#" onClick="toaddpic()">上传至相册</a>
        <tr>
            <th>选择文件</th>
            <th width="50%">预览图</th>
        </tr>
        <tr>
            <td height="200"><input id="idFile" name="upload" type="file" /></td>
            <td align="center"><img id="idImg" /></td>
        </tr>
</table>
</form>
Java后台处理:
    //与前台页面空间name一致
    private File upload;
    //反射,得到文件类型,文件名称
    private String uploadContentType;
    private String uploadFileName;
    public String doAddPhoPic(){
        //自己的PhotoService接口处理
        IPhotoService photoService=BeanFactory.getBean(BeanConstants.WB_PHOTO_SERVICE);
        Photo photo=new Photo();
        //这里简单的demo没有要把名字规范,也没有对图片有剪切或缩小处理,所以就简单的把上传的图片以1,2,3命名
        int count=photoService.queryPhotoList().size();
        count++;
        String file_path1="";
        String file_path2="";
        try {
            //上传至该项目所在本地目录                           
            file_path1=Constants.BASE_ROOT+"/fullsize"+"/"+count+".jpg";
            file_path2=Constants.BASE_ROOT+"/thumbs"+"/"+count+".jpg";
            photo.setPicName(photoService.queryPhotoList().size()+1+".jpg");
            photo.setPicUrl(file_path2);
            photoService.insertPhoto(photo);
            System.out.println("---"+file_path1);
            System.out.println("---"+file_path2);
            //对文件进行写操作
            FileOutputStream fos1=new FileOutputStream(file_path1);
            FileOutputStream fos2=new FileOutputStream(file_path2);
            //对文件进行读操作
            FileInputStream fis=new FileInputStream(upload);
            byte[] buffer=new byte[1024];
            int len=0;
            //读入流,保存至byte数组
            while((len=fis.read(buffer))>0){
                fos1.write(buffer,0,len);
                fos2.write(buffer,0,len);
            }
            fos1.close();
            fos2.close();
            fis.close();
        } catch (Exception e) {
            e.printStackTrace();
        }
        list=photoService.queryPhotoList();
        return SUCCESS;
    }

作者: 付龙    时间: 2013-7-25 12:25
给你个简单的,不过这个也是我从老师那里学习来的!
上传JSP页面
<body>
    <form action="test.do?method=execute4" method="post" enctype="multipart/form-data">
     <tr><td>名字  : <input type="text" id="name" name="name"/></td></tr><br>
     <tr><td>文件  : <input type="file" name="file"/></td></tr><br>
     <input type="submit" value="load...."/>
    </form>
</body>

在action里写你自己的方法名,但是enctype属性一定要有!

action里

                  UploadForm upload = (UploadForm)form;
String filename = upload.getName();
String filepath = "D:/Upload\\";

if(!new File(filepath).isDirectory()){
new File(filepath).mkdir();
}
int length=upload.getFile().getFileName().split("\\.").length;
String file_hz=upload.getFile().getFileName().split("\\.")[length-1];

StringBuilder sb = new StringBuilder();
String file_name = sb.append(filepath).append(filename).append (".").append    (file_hz).toString();


FileOutputStream out;        
try {
out = new FileOutputStream(new File(file_name));
out.write(upload.getFile().getFileData());
out.close();
} catch (FileNotFoundException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}

form是这样的

public class UploadForm extends ActionForm{

private FormFile file;
private String name;



public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}

public FormFile getFile() {
return file;
}
public void setFile(FormFile file) {
this.file = file;
}
}
记的在struts里配置这个form哦

这样执行完就可以在D盘的upload里看到你要传的东西了,至于显示的话
<img src="">在src中写你从数据库里查到的路径,至于保存到数据库和查找就不啰嗦了!
作者: 冒烟的芒果    时间: 2013-7-25 12:55
不知道楼主问的是TCP协议还是HTTP协议上传图片
简单说下TCP协议下的图片上传过程:
客户端:
1、创建Socket s = new Socket("...",10004);,指定目标地址和接口
2、创建一个读取指定文件的字节输入流 FileInputStream fis = new FileInputStream("c:\\...");
3、通过Socket得到一个用于向服务器传数据的字节输出流OutputStream out = s.getOutputStream();
4、通过fis读取文件,并存入指定大小的字节数组buf中;
5、将buf中的内容写入到Socket字节输出流中,并调用flush()方法,数据就能传过去了
接收端也差不多
1、创建ServerSocket;
2、得到Socket字节输入流 in;
3、创建一个写入到指定文件的字符输出流fos ;
4、 将Socket输入流中的数据读到指定大小的字节数组buf中;
5、通过fos将buf中的数据写入指定文件,并调用flush();数据接收完成。
作者: HM代景康    时间: 2013-7-25 13:10
这是一个文件上传的流程   下网对你用用

第一阶段: 构造struts2中针对请求字节流而构造的封闭类MultiPartRequestWrapper
1.FilterDispatcher
在doFilter方法中调用了prepareDispatcherAndWrapRequest方法,为了包装出Struts2自己的request对象,在prepareDispatcherAndWrapRequest方法中调用Dispatcher类的wrapRequest方法,在这个方法里,会根据请求内容的类型(提交的是文本的,还是multipart/form-data格式),决定是使用tomcat的HttpServletRequestWrapper类分离出请求中的数据,还是使用Struts2的MultiPartRequestWrapper来分离请求中的数据。
第二阶段: 执行inteceptor及action.
doFilter方法中,会进一步调用actionMapper的getMapping方法对url进行解析,找出命名空间和action名等,以备后面根据配置文件调用相应的拦截器和action使用。
关于doFilter方法中下一步对Dispatcher类的serviceAction方法的调用,不再描述,总之在action被调用之前,会首先走到fileUpload拦截器(对应的是FileUploadInterceptor类),在这个拦截器中,会先看一下request是不是 MultiPartRequestWrapper,如果不是,就说明不是上传文件用的request,fildUpload拦截器会直接将控制权交给下一个拦截器;如果是,就会把request对象强转为MultiPartRequestWrapper对象,然后调用hasErrors方法,看看有没有上传时候产生的错误,有的话,就直接加到了Action的错误(Action级别的)中了。
另外,在fileUpload拦截器中会将MultiPartRequestWrapper对象中放置的文件全取出来,把文件、文件名、文件类型取出来,放到request的parameters中,这样到了params拦截器时,就可以轻松的将这些内容注入到Action中了,这也就是为什么fileUpload拦截器需要放在params拦截器前面的理由。在文件都放到request的parameters对象里之后,fileUpload拦截器会继续调用其他拦截器直到Action等执行完毕,他还要做一个扫尾的工作:把临时文件夹中的文件删除(这些文件是由commons-fileupload组件上传的,供你在自己的Action中将文件copy到指定的目录下,当action执行完了后,这些临时文件当然就没用了)。





欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2