2016-03-22 7 views
1

Angularjs 1.5.0 Webアプリケーションは、私が開発したRESTベースのWebサービス(dropwizard &ジャージを使用)と通信し、完全に動作することをテストしました。AngularJSで画像をダウンロードしてアップロードする方法

REST Webサービスメソッドは、このようなものです:私が欲しい、私のangularjsコードでhttp://localhost:9980/thumb/random-generated-guid.jpg

@POST 
@Path("/saveImage") 
public Response saveImage(
    @FormDataParam("imagefile") InputStream uploadedInputStream, 
    @FormDataParam("imagefile") FormDataContentDisposition fileDetail) { 

    // save image on server's file system and return OK 
} 

スキャンした画像は、このようなリンクを介して、スキャナのローカルウェブサーバによって私にご利用いただけます上記のリンクで利用可能な画像を自分のRESTサービスに送信する。

誰でもこの方法を知っていますか?

まず、画像をブロブとして保存してから、Webサービスに送信してみました。私はjavascriptのXMLHttpRequestを使用して画像を保存できますが、送信は常に失敗します。 BLOBデータを送信するため

var xhr = new XMLHttpRequest(); 
xhr.open('GET', imageAddress, true); 
xhr.responseType = 'blob'; 
var imageData = null; 

xhr.onload = function(e) { 
    if (this.readyState === 4 && this.status === 200) { 
     // get binary data as a response 
     imageData = this.response; 
     var gatewayResponse = sendToGateway(imageData); 
    } 
}; 

コード:ブロブとして画像を保存するためのコード

var sendToGateway = function(imageDataBlob) { 
     var formdata = new FormData(); 
     formdata.append('imagefile', imageDataBlob) 
     $.ajax({ 
      url: 'http://localhost/eval/saveImage', 
      method: 'POST', 
      contentType: 'multipart/form-data; charset=UTF-8', 
      data: formdata, 
      dataType: 'json', 
     }) 
     .done(function(response) { 
      $log.info("**************** response = " + response); 
      alert("response:\n" + response); 
     }) 
     .fail(function(jqXHR, textStatus, errorThrown) { 
      $log.error("!!!! FAIL !!!!!!!!!"); 
      alert("FAIL !!!!!!!"); 
     }) 
     .always(function(){ 
      $rootScope.scannerInactive = false; 
      doStartPreviewUpdate(); 
     }); 
    }; 

sendToGateway(画像データ)は、実際に、問題です。が呼ばれ、私はエラーを取得:

TypeError: 'append' called on an object that does not implement interface FormData.

value = jQuery.isFunction(value) ? value() : (value == null ? "" : value);

+0

画像がアップロードされた部分をサーバー自体で処理しない理由を述べたURLから入手できる場合は、なぜ、角を発揮するのか。あなたは、どのURLがイメージと必要な他のパラメータを与えるかに関するパラメータを渡すことができます。そして、あなたのsaveImage関数では、uploadongは画像アップロードAPIを使って行うことができます。それは理にかなっていますか? –

+0

@CoderJohn:実際には、REST Webサービスは別のサーバーで実行されるため、サーバー側でアップロードできません。 –

答えて

0

おっとを、私は問題を発見しました。 $ .ajax()呼び出しに次のディレクティブを追加する必要がありました。

processData: false, 
contentType: false, 
関連する問題