使用ajaxfileupload.js异步上传文件到Servlet

        前段时间帮同学做的毕业设计。。好吧又是帮人做。。。需要上传文件,在这里使用了ajaxfileupload.js进行异步的上传文件到Servlet  ,后台保存了文件以后通过JSON返回文件路径到前端,好了废话不多说,直接上代码了。。。

         前端页面比较简单

     <input maxlength=16 type=file name="pic" id="pic" size=16 /> 
     <input type="button"  id="uploadBut" onclick = "ajaxFileUpload()" value="上传" />
        一个表单里面放input就可以了。。注意type是file类型的。。使用ajaxfileupload.js必须先引入jquery.js  然后再引入ajaxfileupload.js  。。。    

    <script type="text/javascript" src="js/jquery.js"></script>  
    <script type="text/javascript" src="js/ajaxfileupload.js"></script> 
        选择了文件以后电击上传触发ajaxFileUpload事件

 function ajaxFileUpload() {  
    	    
    	        $.ajaxFileUpload({  
    	            url : 'UploadServlet',// servlet请求路径  
    	            secureuri : false,  
    	            fileElementId : 'pic',// 上传控件的id  
    	            dataType : 'json',
    	            success : function(data)
    	            {
    	            	alert(data.msg);
    	            	alert("文件路径:"+data.filePath);
    	            	document.getElementById("imagePath").value= data.filePath;
    	            }  
    	        })  
    	        return false;  
    	    }  
       前端就是这样了。。接下来是Servlet接收流进行文件的保存。。。

        

public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

		        //从request当中获取流信息
				InputStream fileSource = request.getInputStream();
				String tempFileName = "C:/tempFile";
				//tempFile指向临时文件
				File tempFile = new File(tempFileName);
				//outputStram文件输出流指向这个临时文件
				FileOutputStream outputStream = new FileOutputStream(tempFile);
				byte b[] = new byte[2 * 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();
				System.out.println(str);
				
				int endIndex = str.lastIndexOf("\"");
				String beginStr = str.substring(0,endIndex);
				int beginIndex = beginStr.lastIndexOf("\"") +1;
				String filename = beginStr.substring(beginIndex, beginStr.length());
				
				System.out.println("filename:" + filename);
				
				//重新定位文件指针到文件头
				randomFile.seek(0);
				long startPosition = 0;
				int i = 1;
				//获取文件内容 开始位置
				while(( n = randomFile.readByte()) != -1 && i <=4){
					if(n == '\n'){
						startPosition = randomFile.getFilePointer();
						i ++;
					}
				}
				startPosition = randomFile.getFilePointer() -1;
				//获取文件内容 结束位置
				randomFile.seek(randomFile.length());
				long endPosition = randomFile.getFilePointer();
				int j = 1;
				while(endPosition >=0 && j<=2){
					endPosition--;
					randomFile.seek(endPosition);
					if(randomFile.readByte() == '\n'){
						j++;
					}
				}
				endPosition = endPosition -1;
				
				//设置保存上传文件的路径
				String realPath = getServletContext().getRealPath("/") + "images";
				File fileupload = new File(realPath);
				if(!fileupload.exists()){
					fileupload.mkdir();
				}
				File saveFile = new File(realPath,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();
				System.out.println(saveFile.toString());
				PrintWriter writer = response.getWriter();
				writer.print(" { ");
				writer.print(" \"success\" : \"true\" ,\"msg\" : \"上传成功! \", \"filePath\" : \"images/" +filename+" \" ");
				writer.print(" } ");
				writer.close(); 
		
	}
         这样就实现了异步上传 文件的功能咯。。。小伙伴们可以去试试看。。。当然后台接收文件的方式还有其他的,可以使用其他的方法大家可以试试看。这里我就不再去试咯。。。


  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值