2012-03-15 24 views
4

私はGWTを初めて使用しています。ファイルアップロード機能を実装しようとしています。 インターネット上でいくつかのインプリメンテーションのヘルプが見つかりました。 しかし、それに関連するいくつかの質問があります。GWT FileUpload - サーブレットオプションと応答の処理

  1. 実際のアップロードまたはサーバ(またはディスク)上のファイルの内容を書き込みはサーブレットによって行われます。 このサーブレット(MyFileUploadServlet)がHttpServletを拡張する必要がありますか? OR RemoteServiceServletを使用することも、他のインターフェイスを実装することもできますか?はいの場合は、どのメソッドを実装/上書きする必要がありますか?

  2. 私のサーブレットでは、すべてが完了した後、クライアントに応答を返す必要があります。 私はそれを達成するためにform.addSubmitCompleteHandler()を使うことができると思います。サーブレットから、text/html(またはString型のオブジェクト)を返し、SubmitCompleteEvent.getResults()を使用して結果を取得できます。 質問:私はカスタムオブジェクトをStringの代わりに使用できますか(MyFileUploadResultと言うことができます)、結果を入力してクライアントに戻しますか? またはJSONオブジェクトを取得できますか?

前>画像のアップロードに成功/ PRE>:

  • は現在、)(応答を取り戻すとSubmitCompleteEvent.getResultsを使用した後、私はいくつかのHTMLタグのような実際の応答に追加取得しています。

    これを取り除く方法はありますか?

    ありがとうございます!

    よろしく、

  • 答えて

    2

    アシシュファイルをアップロードするには、私が過去にHttpServletを拡張しています。私はCommons-FileUploadと一緒に使った。

    フォームベースのアップロード用の一般的なウィジェットを作成しました。これは、さまざまなファイルタイプ(プレーンテキストとBase64)のアップロードに対応することでした。プレーンテキストファイルをアップロードするだけであれば、次の2つのクラスを1つにまとめることができます。

    public class UploadFile extends Composite { 
    
        @UiField FormPanel uploadForm; 
        @UiField FileUpload fileUpload; 
        @UiField Button uploadButton; 
    
        interface Binder extends UiBinder<Widget, UploadFile> {} 
    
        public UploadFile() { 
        initWidget(GWT.<Binder> create(Binder.class).createAndBindUi(this)); 
    
        fileUpload.setName("fileUpload"); 
    
        uploadForm.setEncoding(FormPanel.ENCODING_MULTIPART); 
        uploadForm.setMethod(FormPanel.METHOD_POST); 
    
        uploadForm.addSubmitHandler(new SubmitHandler() { 
         @Override 
         public void onSubmit(SubmitEvent event) { 
         if ("".equals(fileUpload.getFilename())) { 
          Window.alert("No file selected"); 
          event.cancel(); 
         } 
         } 
        }); 
    
        uploadButton.addClickHandler(new ClickHandler() { 
         @Override 
         public void onClick(ClickEvent event) { 
         uploadForm.submit(); 
         } 
        }); 
        } 
    
        public HandlerRegistration addCompletedCallback(
         final AsyncCallback<String> callback) { 
        return uploadForm.addSubmitCompleteHandler(new SubmitCompleteHandler() { 
         @Override 
         public void onSubmitComplete(SubmitCompleteEvent event) { 
          callback.onSuccess(event.getResults()); 
         } 
        }); 
        } 
    } 
    

    UiBinderの部分はかなりストレートです。

    <g:HTMLPanel> 
        <g:HorizontalPanel> 
        <g:FormPanel ui:field="uploadForm"> 
         <g:FileUpload ui:field="fileUpload"></g:FileUpload> 
        </g:FormPanel> 
        <g:Button ui:field="uploadButton">Upload File</g:Button> 
        </g:HorizontalPanel> 
    </g:HTMLPanel> 
    

    このクラスをプレーンテキストファイル用に拡張することができます。 web.xmlがHttpServletに/textuploadを提供していることを確認してください。

    public class UploadFileAsText extends UploadFile { 
    
        public UploadFileAsText() { 
        uploadForm.setAction(GWT.getModuleBaseURL() + "textupload"); 
        } 
    } 
    

    プレーンテキストファイル用のサーブレットはサーバー側にあります。アップロードされたファイルの内容をクライアントに返します。 Apache CommonsからFileUpload用のjarをクラスパスのどこかにインストールしてください。

    public class TextFileUploadServiceImpl extends HttpServlet { 
    
        private static final long serialVersionUID = 1L; 
    
        @Override 
        protected void doPost(HttpServletRequest request, 
         HttpServletResponse response) throws ServletException, IOException { 
    
        if (! ServletFileUpload.isMultipartContent(request)) { 
         response.sendError(HttpServletResponse.SC_BAD_REQUEST, 
          "Not a multipart request"); 
         return; 
        } 
    
        ServletFileUpload upload = new ServletFileUpload(); // from Commons 
    
        try { 
         FileItemIterator iter = upload.getItemIterator(request); 
    
         if (iter.hasNext()) { 
         FileItemStream fileItem = iter.next(); 
    
    //  String name = fileItem.getFieldName(); // file name, if you need it 
    
         ServletOutputStream out = response.getOutputStream(); 
         response.setBufferSize(32768); 
         int bufSize = response.getBufferSize(); 
         byte[] buffer = new byte[bufSize]; 
    
         InputStream in = fileItem.openStream(); 
         BufferedInputStream bis = new BufferedInputStream(in, bufSize); 
    
         long length = 0; 
    
         int bytes; 
         while ((bytes = bis.read(buffer, 0, bufSize)) >= 0) { 
          out.write(buffer, 0, bytes); 
          length += bytes; 
         } 
    
         response.setContentType("text/html"); 
         response.setContentLength(
          (length > 0 && length <= Integer.MAX_VALUE) ? (int) length : 0); 
    
         bis.close(); 
         in.close(); 
         out.flush(); 
         out.close(); 
         } 
        } catch(Exception caught) { 
         throw new RuntimeException(caught); 
        } 
        } 
    } 
    

    <pre></pre>タグの問題点を思い出してはいけません。クライアント上のタグをフィルタリングする必要があるかもしれません。トピックはhereにも記載されています。