javascript - Javascript/JQuery で REST Web サービスから画像を取得する

Question

REST Web サービスからバイナリ データをフェッチして、イメージ タグ src を動的に設定しようとしています。私のリンクは myhost:port/docId/imageId/file のようなもので、「application/octet-stream」のコンテンツ タイプを返し、datatType はバイナリです。私のアプローチは、このバイナリ データを取得し、base64 でエンコードして (jquery.base64.js を使用)、base64 でエンコードされたデータを src に入れることです。一部のコード部分は次のとおりです。

            $.ajax({
          url: " myhost:port/docId/imageId/file ",
          datatype: "binary",
          beforeSend: function (xhr) {
              xhr.overrideMimeType("text/plain; charset=x-user-defined");
          },
          success: function(image){
              var imgBase64 = $.base64.encode(image);
              return  imgBase64  ;
          },
          error: function(xhr, text_status){
              console.log("An error again " + text_status);
          }
    });

私が取った別の単純なAJAXアプローチは次のとおりです。

  req.open('GET', " myhost:port/docId/imageId/file" , false);
  req.overrideMimeType('text\/plain; charset=x-user-defined');
  if (req.status != 200){
          console.log("Status code not 200");
          return '';
      }
  return req.responseText;

MIME タイプを上書きしています。そうしないと、GET はステータス 200 OK を示していますが、フェッチで何らかのエラーがスローされます。今、私は base64 エンコーディング "req.responseText" [var imgBase64 = $.base64.encode( req.responseText );] を画像の src に入れています。

これは、base64 データを img に入れる方法です: var imageSource = "data:image/png;base64," + imgBase64 ; $('#imageId').attr('src', imageSource);
ただし、どちらの場合もエンコード中にjquery base64が例外「INVALID_CHARACTER_ERR: DOM Exception 5」をスローしています。base64 データを src に入れるときにこの例外を抑制して強制的にエンコードしても、Firebug で破損したデータが表示されます。私の感覚では、MIME タイプをオーバーライドしているため、バイナリ データのエンコーディングが何らかの形で改ざんされているため、base64 エンコーディング中にいくつかの問題が発生しています。

REST APIから画像(jpeg/png/gif/時々tif)ファイルを取得する方法を示すことができますか?