欧美一区二区三区老妇人-欧美做爰猛烈大尺度电-99久久夜色精品国产亚洲a-亚洲福利视频一区二区

基于jsp的AJAX多文件上傳的實(shí)現(xiàn)

   最近的項(xiàng)目開發(fā)中，遇到了一個多文件上傳的問題，即在不刷新頁面的情況下，上傳多個文件至服務(wù)器。現(xiàn)總結(jié)分享如下：

創(chuàng)新互聯(lián)公司專注于嵐山網(wǎng)站建設(shè)服務(wù)及定制，我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗(yàn)。 熱誠為您提供嵐山營銷型網(wǎng)站建設(shè)，嵐山網(wǎng)站制作、嵐山網(wǎng)頁設(shè)計(jì)、嵐山網(wǎng)站官網(wǎng)定制、重慶小程序開發(fā)公司服務(wù)，打造嵐山網(wǎng)絡(luò)公司原創(chuàng)品牌,更為您提供嵐山網(wǎng)站排名全網(wǎng)營銷落地服務(wù)。

   本文主要采用了基于jsp的ajax，jquery，servlet等技術(shù)。

1.upload.jsp

   點(diǎn)擊上傳時，調(diào)用對應(yīng)的fileupload函數(shù)，通過ajax將文件異步傳送到servlet中處理。注意在文件上載時，所使用的編碼類型應(yīng)當(dāng)是“multipart/form-data”，它既可以發(fā)送文本數(shù)據(jù)，也支持二進(jìn)制數(shù)據(jù)上載。

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!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">
<base href="<%=basePath%>">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/ajaxfileupload.js"></script>
</head>
<script language="JavaScript" type="text/javascript">
    var buildph=0;
    var typeph=0;
    var planph=0;
    function fileupload1(){
        if($("#locationphoto").val()==""){
            alert("上傳文件不能為空!");
            return false;
        }
        var file = $("#locationphoto").val();
        var pos=file.lastIndexOf("\\");
var fileName=file.substring(pos+1);//獲得文件名字
                                                                                                                                                                                                                                                             
        $.ajaxFileUpload({
                                                                                                                                                                                                                                                                     
                url:"PictureServlet";,
                contentType:"multipart/form-data; text/xml;charset=utf-8",
                secureuri:false,
                cache: false,//防止緩存
                fileElementId:'locationphoto',
                dataType: 'text/xml',
                success: function (data) {
                    document.getElementById("locationspan").innerHTML = fileName;
                    alert(fileName);
                },error: function (data, status, e){
                    alert("fail");
                }
            }
        );
    }
    function fileupload2(){
        if($("#buildingphoto").val()==""){
            alert("上傳文件不能為空!");
            return false;
        }
        var file = $("#buildingphoto").val();
        var pos=file.lastIndexOf("\\");
        var fileName=file.substring(pos+1);
        buildph++;
        $.ajaxFileUpload({
                                                                                                                                                                                                                                                                     
                url:"PictureServlet";,
                contentType:"multipart/form-data; text/xml;charset=utf-8",
                secureuri:false,
                cache: false,//防止緩存
                fileElementId:'buildingphoto',
                dataType: 'text/xml',
                success: function (data) {
                    document.getElementById("buildingspan"+buildph).innerHTML = fileName;
                    alert(fileName);
                },error: function (data, status, e){
                    alert("fail");
                }
            }
        );
    }
    function fileupload3(){
        if($("#typePhoto").val()==""){
            alert("上傳文件不能為空!");
            return false;
        }
        var file = $("#typePhoto").val();
        var pos=file.lastIndexOf("\\");
        var fileName=file.substring(pos+1);
        typeph++;
        $.ajaxFileUpload({
                                                                                                                                                                                                                                                                     
                url:"PictureServlet";,
                contentType:"multipart/form-data; text/xml;charset=utf-8",
                secureuri:false,
                cache: false,//防止緩存
                fileElementId:'typePhoto',
                dataType: 'text/xml',
                success: function (data) {
                    document.getElementById("typespan"+typeph).innerHTML = fileName;
                    alert(fileName);
                },error: function (data, status, e){
                    alert("fail");
                }
            }
        );
    }
</script>
<body>
<form id="form1" name="form1" method="post"  action="">
  <table width="663" height="316"  align="center">
    <tr>
      <td height="30" colspan="2">樓盤位置圖：
       <span  id="locationspan" ></span>
      <input type="file" name="locationphoto" id="locationphoto" value="this.val()"/>
      <input type="button" name="fileLoad1" id="fileLoad1" value="上傳" onClick="fileupload1()"/>
      </td>
    </tr>
     <tr>
      <td height="30" colspan="2">樓盤照片：
      <span  id="buildingspan1" ></span>
     <span  id="buildingspan2" ></span>
      <span  id="buildingspan3" ></span>
     <span  id="buildingspan4" ></span>
      <input type="file" name="buildingphoto" id="buildingphoto" value="this.val()"/>
      <input type="button" name="fileLoad2" id="fileLoad2" value="上傳" onClick="fileupload2()"/>
      </td>
    </tr>
        <tr>
      <td height="30" colspan="2">樓盤戶型圖：
        <span  id="typespan1" ></span>
        <span  id="typespan2" ></span>
        <span  id="typespan3" ></span>
        <span  id="typespan4" ></span>
      <input type="file" name="typePhoto" id="typePhoto" value="this.val()"/>
      <input type="button" name="fileLoad3" id="fileLoad3" value="上傳" onClick="fileupload3()"/>
      </td>
    </tr>
  </table>
</form>
</body>
</html>

2.PictureServlet.java

   通過該servlet接受jsp上傳的數(shù)據(jù)流，存儲到相應(yīng)路徑，并解析出文件名。

package com.servlet;
import java.io.BufferedOutputStream;
import java.io.DataOutputStream;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.ServletInputStream;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.realty.base.action.BuildingAction;
/**
 * Servlet implementation class PictureServlet
 */
@WebServlet("/PictureServlet")
public class PictureServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
                                                                                                       
    /**
     * @see HttpServlet#HttpServlet()
     */
    public PictureServlet() {
        super();
        // TODO Auto-generated constructor stub
    }
    /**
     * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        doPost(request,response);
    }
    /**
     * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
     */
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
         response.setContentType("text/xml");//是xml
            response.setHeader("Cache-Control", "no-cache");
            response.setCharacterEncoding("UTF-8");
            String filepath ="E:/pic/";//文件上傳的路徑，實(shí)際開發(fā)中一般用相對路徑
            String filename = "";
            String name="";
            ServletInputStream in = request.getInputStream();
            byte[] buf = new byte[4048];
            int len = in.readLine(buf, 0, buf.length);
            String f = new String(buf, 0, len - 1);
            while ((len = in.readLine(buf, 0, buf.length)) != -1) {
                filename = new String(buf, 0, len,"utf-8");//解決漢字亂碼問題
                int j = filename.lastIndexOf("\"");
                int s = filename.indexOf("filename");
                name=filename.substring(s+10,j);
                filename = name;//通過上述處理可以得到上傳的文件名
                System.out.println("filename="+filename);
                                                                                                                   
                DataOutputStream fileStream = new DataOutputStream(new BufferedOutputStream(new FileOutputStream(filepath+ filename)));
                len = in.readLine(buf, 0, buf.length);
                len = in.readLine(buf, 0, buf.length);
                while ((len = in.readLine(buf, 0, buf.length)) != -1) {
                    String tempf = new String(buf, 0, len - 1);
                    if (tempf.equals(f) || tempf.equals(f + "--")) {
                        break;
                    }
                    else{
                         fileStream.write(buf, 0, len); // 寫入
                    }
                }
                fileStream.close();
            }
            PrintWriter out=response.getWriter();
            String result = filename ;
            out.print(result);
            out.close();
            in.close();                                              
    }
}

   注意相關(guān)jar包的引入，見附件。

本文標(biāo)題：基于jsp的AJAX多文件上傳的實(shí)現(xiàn)
分享URL：http://chinadenli.net/article36/gsgcpg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站改版、網(wǎng)站維護(hù)、企業(yè)網(wǎng)站制作、電子商務(wù)、網(wǎng)站策劃、App開發(fā)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站建設(shè)