zoukankan      html  css  js  c++  java
  • java Web开发实现手机拍照上传到服务器

    第一步:

     
      搭环境,基本jdk 1.6+apache tomcat6.0+myeclipse2014
    1.我们要清楚自己的jdk版本。因为我们Apache Tomcat配置的成功的前提是版本相对应。
    安装jdk1.6是由于myeclipse中新建webproject时,有可能只有1.6和1.7两个选项,不过不同的myeclipse版本应该不同,如下图:
    
    

    clipboard.png

    具体安装的jdk的过程和环境变量的设置就百度一下,教程很多,安装好了之后,查看一下版本,如下图:

    clipboard.png

    2.安装apache tomcat6.0,推荐安装压缩版,下载之后直接解压缩,然后设置一下环境变量就可以用了。
    解压缩都随便一个盘都行,下图是我的路径:

    clipboard.png

    5.配置相关环境变量,由于本人之前已经配置了Java开发时环境,即JDK。因此JAVA_HOME就不必再配置了
    1)环境变量1:CATALINA_HOME,环境变量值:F: omcat-6.0.35
    (环境变量值即为相应ZIP文件解压目录)
    2)环境变量2:CATALINA_BASE,环境变量值:F: omcat-6.0.35
    (与CATALINA相同)
    3)环境变量2:TOMCAT_HOME,环境变量值:F: omcat-6.0.35
    (与CATALINA相同)
    4)环境变量3:CALSSPATH,修改环境变量值,在其后加上:%CATALINA_HOME%libservlet-api.jar;
    5)环境变量4:PATH,修改环境变量值,在其后加上:%CATALINA_HOME%libservlet-api.jar;
    图片展示:

    clipboard.png

    clipboard.png

    环境变量设置好了之后,需要修改一些tomcat的配置信息,路径:F: omcat-6.0.35confserver.xml如何跟下图一样的,可以不用修改:

    clipboard.png

    上面的东西全部配置完成之后,可以启动一下tomcat,看是否配置成功,双击 F: omcat-6.0.35in目录下的startup.bat:

    clipboard.png

    这样就显示配置成功了,然后我们可以访问一下tomcat自带的例子,打开浏览器输入localhost:80/index.html,80是端口号,可自行修改,如何没有修改过,则是8080,如下图所示:

    clipboard.png

    3.安装myeclipse 2014,安装过程很简单,只分享一下安装包和破解包,破解包中自带破解教程,百度云链接https://pan.baidu.com/s/1c13JSdE 密码:3ji7

    安装与破解完成之后,首先将myeclipse的编码格式改为UTF-8国际编码。
    window->perferences 如图:

    clipboard.png

    由于myeclipse不会自动导入你配置好的jdk,需要手动配置,因为没有什么特殊的,直接百度配置教程:http://jingyan.baidu.com/arti...

    myeclipse中配置tomcat和如何启动的教程也比较多,也好找,链接:http://jingyan.baidu.com/arti...
    这是我配置好了后

    clipboard.png

    点击上图中圆圈圈起来的图标,启动你自己导入的tomcat,然后矩形框是用来将你创建的web project映射到F: omcat-6.0.35webapps目录下

    clipboard.png

    新建一个web project

    clipboard.png
    ...]

    然后映射到webapps目录下:

    clipboard.png

    clipboard.png

    clipboard.png

    然后开始写代码:
    首先将index.jsp的编码格式设置为UTF-8

    clipboard.png

    然后导入jsp-api.jar,这个包在
    clipboard.png

    index.jsp中的主要代码为
    form 中action的值为与后面建立的servlet/JSP mapping URL一致,可以先建立了servlet再来修改这个值。
    ${result}这个显示上传状态,与后面在SmartUpload.java中有定义。
    showPreView(this)方法是用来预览图片的。

    <form action="SmartUpload.do" enctype="multipart/form-data" method="post">
            <input id="img" type="file" name="file1" accept="image/*" capture="camera" onchange="showPreview(this)" style="height: 130px;  460px; "><br/>
             
             <input type="submit" value="提交" style="height: 48px;  90px; "><br/>
            <div id="preview"></div><br/>
            ${result}    
        </form>
      </body>
      <script    type="text/javascript">
            var fileList=document.getElementById("preview");
            function showPreview(obj){
                var files = obj.files,
                    img = new Image();
                    if(window.URL){
                    //File API
                    //alert(files[0].name + "," + files[0].size/(1024*1024) + "MB");
                    img.src = window.URL.createObjectURL(files[0]); //创建一个object URL,并不是你的本地路径
                    img.width = 200;
                    img.onload = function(e) {
                        window.URL.revokeObjectURL(this.src); //图片加载后,释放object URL
                    }
                    fileList.appendChild(img);
               
                }
                else if(window.FileReader){
                    //opera不支持createObjectURL/revokeObjectURL方法。我们用FileReader对象来处理
                    
               
                    var reader = new FileReader();
                    reader.readAsDataURL(files[0]);
                    reader.onload = function(e){
                       // alert(files[0].name + "," +e.total/(1024*1024) + "MB");
                        img.src = this.result;
                        img.width = 200;
                        fileList.appendChild(img);
                   
                    }
                }
                else{
                    //ie
                    obj.select();
                    obj.blur();
                    var nfile = document.selection.createRange().text;
                    document.selection.empty();
                    img.src = nfile;
                    img.width = 200;
                    img.onload=function(){
                     //   alert(nfile+","+img.fileSize/(1024*1024) + "MB");
                    }
                    fileList.appendChild(img);
                }
                }
        </script>
    

    新建servlet

    clipboard.png

    clipboard.png

    clipboard.png

    建立成功了之后,可以看到web.xml中的一些自动配置好的信息:

    clipboard.png

    SmartUpload.java

    package com.upload;
    
    import java.io.File;
    import java.io.FileOutputStream;
    import java.io.IOException;
    import java.io.InputStream;
    
    import java.io.RandomAccessFile;
    import java.text.SimpleDateFormat;
    import java.util.Date;
    
    
    import javax.servlet.RequestDispatcher;
    import javax.servlet.ServletException;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    
    
    
    public class SmartUpload extends HttpServlet {
    
         // 定义允许上传的文件扩展名
        private String Ext_Name = "gif,jpg,jpeg,png,bmp,swf,flv,mp3,wav,wma,wmv,mid,avi,mpg,asf,rm,rmvb,doc,docx,xls,xlsx,ppt,htm,html,txt,zip,rar,gz,bz2";
        //显示上传文件的结果
        private String result=null;
        public void doGet(HttpServletRequest req, HttpServletResponse resp)
                throws ServletException, IOException {
            doPost(req,resp);
            
        }
    
        
        public void doPost(HttpServletRequest req, HttpServletResponse resp)
                throws ServletException, IOException {
            //获取上传文件流
            InputStream fileSource=req.getInputStream();
            //设置临时文件名
            String tempFileName="F:/tempFile";
            File tempFile=new File(tempFileName);
            //文件输出流,将上传的文件写入按字节流临时文件
            FileOutputStream outputStream=new FileOutputStream(tempFile);
            byte b[]=new byte[1024];
            int n;
            while((n=fileSource.read(b))!=-1){
                outputStream.write(b,0,n);
            }
            outputStream.close();
            fileSource.close();
            //创建文件随机流,读取临时文件
            RandomAccessFile randomFile=new RandomAccessFile(tempFile,"r");
            //第一行的垃圾数据不需要
            randomFile.readLine();
            //在第二行中获取文件后缀名
            String str=randomFile.readLine();
            //获取文件后缀名
            String fileExt=str.substring(str.indexOf(".")+1,str.lastIndexOf(""")).toLowerCase();
             // 检查扩展名
            // 如果需要限制上传的文件类型,那么可以通过文件的扩展名来判断上传的文件类型是否合法
            System.out.println("上传的文件的扩展名是:" + fileExt);
            if(!Ext_Name.contains(fileExt)){
                System.out.println("上传文件扩展名是不允许的扩展名:" + fileExt);
               result = result + "上传文件扩展名是不允许的扩展名:" + fileExt + "<br/>";
               randomFile.close();
               RequestDispatcher dispatcher=req.getRequestDispatcher("index.jsp");
                   dispatcher.forward(req, resp);
               return;
            }
            //得到保存文件的名字
            String filename=makeFileName(fileExt);
        
            
            //重新定位文件指针到文件头
            randomFile.seek(0);
            long startPosition=0;
            int i=1;
            while((n=randomFile.readByte())!=-1&&i<=4){
                if(n=='
    '){
                    startPosition=randomFile.getFilePointer();
                    i++;
                }
            }
            //startPosition=startPosition-1;
        
            
            //获取文件内容结束位置
            randomFile.seek(randomFile.length());
            long endPosition=randomFile.getFilePointer();
            
            int j=1;
            while(endPosition>=0&&j<=2){
                endPosition--;
                randomFile.seek(endPosition);
                if(randomFile.readByte()=='
    '){
                    j++;
                }
            }
            endPosition=endPosition-1;
            String savePath="F:/images";
            File fileupload=new File(savePath);
            if(!fileupload.exists()){
                fileupload.mkdir();
            }
            //新建文件和文件名字
            File saveFile=new File(savePath,filename);
            RandomAccessFile randomAccessFile=new RandomAccessFile(saveFile,"rw");
            //从临时文件的当中读取文件内容
            randomFile.seek(startPosition);
            while(startPosition<endPosition){
                randomAccessFile.write(randomFile.readByte());
                startPosition=randomFile.getFilePointer();
            }
            //关闭输入输出流,删除临时文件
            randomAccessFile.close();
            randomFile.close();
            tempFile.delete();
            req.setAttribute("result","上传成功");
            
            RequestDispatcher dispatcher=req.getRequestDispatcher("index.jsp");
            dispatcher.forward(req, resp);
            
            
        }
        private String makeFileName(String fileExt) {
            // 将文件名定义为年月日秒便于区分
            Date nowDate=new Date();
            SimpleDateFormat matter1=new SimpleDateFormat("yyyyMdHms");
            String timePattern =matter1.format(nowDate);
            System.out.println(timePattern);
            return timePattern+ "."+fileExt;
    
        }
        
        
    
    }
    

    上传图片的页面效果:

    clipboard.png

    clipboard.png

  • 相关阅读:
    图片处理中的Dithering技术
    网络I/O模型
    并发编程(二)
    并发编程(一)
    socket编程(二)
    socket编程(一)
    异常处理
    软件开发规范
    面向对象进阶
    多态与封装
  • 原文地址:https://www.cnblogs.com/10manongit/p/12870094.html
Copyright © 2011-2022 走看看