web-dev-qa-db-ja.com

Web API Getメソッドで画像を返す方法

Web API Getメソッドで画像を返す必要があります。以下のコードは、FiddlerのImageViewウィンドウで「この応答はエンコードされていますが、イメージであるとは主張していません」というメッセージが表示されることを除いて、正常に機能するようです。

public HttpResponseMessage Get()
{
    using (FileStream fs = new FileStream(filePath, FileMode.Open))
    {
        HttpResponseMessage response = new HttpResponseMessage(); 
        response.Content = new StreamContent(fs);
        response.Content.Headers.ContentType = new MediaTypeHeaderValue("image/jpeg");
        return response;
    }
} 

私もこのコードでフィドラーに同じ結果が表示されます:

public HttpResponseMessage Get()
{
    HttpResponseMessage response = new HttpResponseMessage();
    Byte[] b = (GetImageByteArray());
    response.Content = new ByteArrayContent(b);
    response.Content.LoadIntoBufferAsync(b.Length).Wait();
    response.Content.Headers.ContentType = new MediaTypeHeaderValue("image/jpeg");
    return response;
}

.png形式を使用しても同じ結果が得られます。

あなたの助けに感謝、

25
J.D.

私が正しく理解している場合、あなたはasp.netコアに固有の質問です。 ASP.netコアでは、HttpResponseMessageは、ASP.net Web API 2で使用していた方法で結果を返す方法ではありません。

Asp.netコア(WEB API)では、単純に次のようになります。

[HttpGet]
public IActionResult Get()
{            
    Byte[] b = System.IO.File.ReadAllBytes(@"E:\\Test.jpg");   // You can use your own method over here.         
    return File(b, "image/jpeg");
}

注:Fiddler Imageviewでは、「応答はエンコードされていますが、イメージであるとは主張していません」というようなメッセージが表示されます。 ASP.netコアはHttpResponseMessageを単純なクラスと見なし、jsonまたはxmlに変換するためです。

35
dotnetstep

これは、プロジェクトでAPIから画像を取得する方法です。私は誰の懸念を共有します。

画像コンテンツはサーバーの画像フォルダーに保存され、画像名はデータベースに保存されます。

[Route("api/dashboard/GetImage")]
public byte[] GetImage(int componentId)
{
            using (var dashboardService = new DashboardService())
            {
                var component = dashboardService.GetImage(componentId);
                var context = HttpContext.Current;
                string filePath = context.Server.MapPath("~/Images/" + component.ImageName);
                context.Response.ContentType = "image/jpeg";
                using (FileStream fileStream = new FileStream(filePath, FileMode.Open))
                {
                    using (var memoryStream = new MemoryStream())
                    {
                        fileStream.CopyTo(memoryStream);
                        Bitmap image = new Bitmap(1, 1);
                        image.Save(memoryStream, ImageFormat.Jpeg);

                        byte[] byteImage = memoryStream.ToArray();
                        return byteImage;
                    }
                }
            }
}

Angularで画像コンテンツを取得する

this.dashboardService.getImage(this.componentId)
    .subscribe((blob: any) => {
      let objectURL = 'data:image/jpeg;base64,' + blob;
      this.imageUrl = this.sanitizer.bypassSecurityTrustUrl(objectURL);;
});
2
Hien Nguyen

これらのコメントは見逃しやすいので、この答えを追加します(私がほとんどやったように)。

Jussi Paloによる提案(PhysicalFileResultを使用):

[HttpGet]
public IActionResult Get()
{        
    return PhysicalFile(@"E:\\Test.jpg", "image/jpeg");
}
  • 206パーシャルのようなものを処理する素敵なシングルライナー。

Tsengからの提案(ストリームを受け入れるFileContentResultコンストラクターのオーバーロードを使用):

[HttpGet]
public IActionResult Get()
{        
    FileStream stream = File.Open(@"E:\\Test.jpg");
    return File(stream, "image/jpeg");
}
  • ストリームが他の場所(埋め込みリソースなど)から来ている場合に便利です。

RLの場合、ファイル/リソースの存在を確認し、存在しない場合は404を返すことを忘れないでください。

0
Mark