WEB文件上傳方案探索（一）

在上次對大數據導入功能方案設計中，主要對方案的選擇和數據導入的實現進行了分析研究，此次，咱們就對文件如何高效地上傳到服務器作一次分析和總結。

文件上傳並非一份困難的工做，但將它限制於WEB的領域彷佛就有一些探索的價值了。正如上次文章《基於Oracle的大數據導入方案探索》中所言，文件上傳受到WEB架構的一些影響，若是是上傳幾K或者幾十K的文件固然不在話下，但若是是幾百兆甚至幾個G的文件來講，就應該慎重考慮一下了。WEB文件上傳和其餘網絡應用同樣，都是經過一些網絡技術將客戶端文件上傳到服務器上，只不過客戶端程序是一個瀏覽器而已。對於WEB性質的文件上傳，無非就在於客戶端和服務端技術方案的選擇和設計。

1、客戶端技術

客戶端技術是WEB文件上傳的重點，由於WEB自己是運行於服務端的程序，只不過經過瀏覽器來讓客戶端訪問，要實如今WEB中訪問客戶端資源就必須實現web中對本地資源的操做。

經過研究和總結，對於web上的客戶端應用一般採用的插件嵌入的方式來實現，文件上傳也不例外，能夠經過如下方式實現：

（1）HTML方式。

（2）RIA方式。

（3）插件方式。

（一）HTML方式

HTML方式是你們使用最多也是最容易使用的方式，它經過<input type=」file」>的標籤打開文件瀏覽器，經過文件選擇和流化，最終將文件以數據流的方式發送到服務端。

支持此方式的開源框架不少，好比struts的文件上傳機制等，此處以Struts2爲例簡單講解一下。

首先，web頁面中應該有一個form表單，其中包括<input type=」file」>標籤。

<form id="upLoadForm" action="${ctx}/dataImport/uploadData.action" method="post" enctype="multipart/form-data" style="display:none"> <input type="button" value="添加文件" onclick="addFile();"/> <input type="submit" value="上傳" onclick="return checkFile();"/> <!--對於每一個JSP頁面要設置type以及subType--> <input type="hidden" id="type" name="type" value="airline"/> <input type="hidden" id="subType" name="subType" value="newAirline" /> <br> <input id="file" type="file" name="file" size="70" /> <img  src="${ctx}/styles/p_w_picpaths/upload/delete.gif" onclick="removeInput();"/> <br> </form>

此處須要注意file標籤的name屬性須要和後臺action中的file文件名稱一致，表單須要設定以multipart的方式來封裝數據enctype="multipart/form-data"。

後臺的Action中須要完成對前臺傳輸的文件對象進行拷貝就行，具體的文件對象封裝將由Struts框架來實現完成。

…… //上傳文件 private List<File> file;  ……     public String upload() throws Exception{ //需修改成從session中獲取用戶名 String uploadUser = "uploadUser"; //獲取上傳文件數目 int len = file==null?0:file.size(); //遍歷上傳文件，並上傳 for(int i=0;i<len;i++){ File upFile = file.get(i); fileService.addFile(upFile, fileFileName.get(i), uploadUser, type); } return type; }

方法中能夠看出，後臺在獲取到file對象之後就執行了文件拷貝到服務器目錄下的工做。

此方案實現相對簡單，對於小文件的上傳是一個不錯的選擇。

（二）RIA方式

RIA是Rich Internet Applications的縮寫，翻譯成中文爲豐富的因特網應用程序，它是集桌面應用程序的最佳用戶界面功能與Web應用程序的廣泛採用和快速、低成本部署以及互動多媒體通訊的實時快捷於一體的新一代網絡應用程序。它能夠經過以web結合方式來提供更好的web用戶體驗和操做。經常使用的RIA方式包括JAVAFX和Microsoft的Silverlight等等，在方案中，咱們就能夠經過這些方式將本地文件選取集成到RIA程序中，經過其向服務端發起文件上傳的請求和數據，從而完成文件上傳功能。

以Flex爲例，Flex中提供了FileRefference類，其中包括了不少文件操做相關的方法和事件，提供了咱們對於文件操做的接口，如圖

                     

有了upload方法，上傳進度和上傳完成事件，能夠很容易地實現大文件上傳和進度顯示任務。Flash上傳的文件大小是沒有限制的，經測試，能夠上傳600多MB的文件。不過要注意的是，若是該文件須要在Flash播放器中播放，則最大限制爲100MB，因此在上傳視頻文件且須要在瀏覽中播放時要注意這個題。

         

                     

（三）插件方式

插件方式是指在瀏覽器中經過embed方式嵌入或者植入插件方式進行數據文件的獲取，從而經過web通訊技術將數據流發送到服務端的方式。此方式的實踐方案包括ActiveX和Applet技術等，前者能夠經過VB開發出CAB插件，在瀏覽器上使用，後者則經過applet標籤將applet客戶端小程序嵌入到頁面來完成。不過applet受限於沙箱的安全策略，要對客戶端文件系統操做須要安裝數字簽名。

以下是一個Applet實現的文件上傳客戶端代碼。

 

public class SoonecUpload extends JApplet

  implements ActionListener

{

  JSObject myBrowser;

  JLabel label;

  JLabel inflab;

  JTable table;

  JButton[] btn;

  JPanel panel;

  JPanel subpanel;

  JPanel cur_panel;

  JPanel total_panel;

  JProgressBar cur_jpb;

  JProgressBar total_jpb;

  MSTable mt;

  Thread ft;

  String type;

  long size;

  String path;

  byte rename;

  String server_url;

  String langs;

  Map languages;


  public SoonecUpload()

  {

    this.mt = null;

    this.ft = new Thread();

    this.type = "jpeg,jpg,gif,png";

    this.size = 51200L;

    this.path = "uploads";

    this.rename = 1;

    this.server_url = "";

    this.langs = "en";

  }


  public void init() {

    super.init();

    this.languages = new HashMap();

    if (getParameter("type") != null) {

      this.type = getParameter("type").toLowerCase();

    }

    if (getParameter("path") != null) {

      this.path = getParameter("path");

    }

    if ((getParameter("language") != null) && (getParameter("language").toLowerCase().equals("cn"))) {

      this.langs = "cn";

    }

    initLanguages();

    if (getParameter("size") != null) {

      this.size = Long.parseLong(getParameter("size"));

    }

    this.server_url = getCodeBase() + "";

    if (!(this.server_url.startsWith("http://"))) {

      JOptionPane.showMessageDialog(null, getLanguage("error_url"), "SOONEC.ZHOU", 0);

      stop();

      destroy();

      return;

    }


    this.server_url = this.server_url.substring(0, this.server_url.toLowerCase().replaceAll("http://", "").indexOf("/") + 7) + "/";

    if ((getParameter("virtual_dir") != null) && (!getParameter("virtual_dir").equals("")))

    {

      SoonecUpload tmp275_274 = this; tmp275_274.server_url = tmp275_274.server_url + getParameter("virtual_dir") + "/";

    }


    this.myBrowser = JSObject.getWindow(this);

    createUI();

  }

……

  public void actionPerformed(ActionEvent paramActionEvent)

  {

    String str = paramActionEvent.getActionCommand();

    if ((str.equals("Browser")) || (str.equals("添加文件"))) {

      getFileList();

    }

    else if ((str.equals("Upload")) || (str.equals("上傳文件")))

    {

      try

      {

        this.ft = new Thread(new getThread(this));

        this.ft.start();

      }

      catch (Exception localException)

      {

      }


    }

    else if ((str.equals("Delete")) || (str.equals("刪除所選"))) {

      if ((this.table.getValueAt(this.table.getSelectedRow(), 4).equals("1")) || (this.table.getValueAt(this.table.getSelectedRow(), 4).equals("2"))) {

        return;

      }

      File localFile = new File((String)this.table.getValueAt(this.table.getSelectedRow(), 1));

      this.total_jpb.setMaximum(this.total_jpb.getMaximum() - (int)Math.round(localFile.length() / 1024.0D));

      if (this.table.getValueAt(this.table.getSelectedRow(), 4).equals("1"))

        this.total_jpb.setValue(this.total_jpb.getValue() - (int)Math.round(localFile.length() / 1024.0D));

      this.mt.removeRow(this.table.getSelectedRow());

    }

    else

    {

      if (str.equals("Stop"))

      {

        return;

      }


      getAuthor();

    }

  }

……

以上代碼雖然看上去很長，但核心部分就是經過調用JFileChooser對象來實現對客戶端文件進行選取操做，而後經過請求發送到服務端。

建立完Applet，須要將其嵌入到web頁面之中。

<body>      <APPLET id="filechooser" codebase="." code="com.travelsky.upload.SoonecUpload.class"  width=560 height=200 ">         <param name="type" value="zip,gz,bmp,jpg,jpeg,gif,txt,cer"/>           <param name="size" value="500000"/>            <param name="path" value="uploadss"/>              <param name="norename" value="0"/>                <param name="virtual_dir" value=""/>    <param name="language" value="en"/>         </APPLET>   </body>

以上經過applet標籤將以前的applet嵌入到頁面中，param是向applet中傳遞的參數，在applet.class中能夠經過getParam方法獲取。

完成以上固然不夠，要打破沙箱策略限制，還須要對applet進行數字簽名，具體方法以下：

<1>、生成密匙證書(key certificate)，該證書將存儲在你的.keystore文件中。Validity指的是密匙的有效期，默認是180，可是這裏咱們須要一年的時間，因此咱們設置爲365
keytool -genkey -alias FileFtpApplet -validity 365 -keystore FileFtpApplet.keystore
<2>、用咱們的密匙來設計咱們的APPLET
jarsigner -keystore FileFtpApplet.keystore FileFtpApplet.jar FileFtpApplet
<3>、導出證書
keytool -export -keystore FileFtpApplet.keystore -alias FileFtpApplet -file FileFtpApplet.cer

2、服務端技術

客戶端的只要功能是完成本地文件的獲取併發送請求及文件數據，那麼在服務端如何接收請求及如何處理請求又是另外一個問題。

爲了配合web客戶端實現文件上傳，服務端一般能夠採用三種技術實現：

（1）Socket通訊技術，利用socket實現服務端和客戶端通訊；

（2）URLconnection，經過apache的net包中的Urlconnection模擬通訊；

（3）FTPClient，利用apache實現的ftp包來實現數據文件上傳。

具體各類服務端技術請見下回具體介紹。