.NET WebApi返回图片

---

theme: smartblue

参考

asp.net web api返回图片至前端 - GUOKUN - 博客园 (cnblogs.com)

vue获取图片流数据并展示_vue展示图片流-CSDN博客

vue中接受后台传过来的图片文件流blob前端进行展示实现方法_blob本地文件路径 在h5如何显示 vue-CSDN博客

后端返回

核心代码

[HttpGet] public async Task<IActionResult> GetPic() { MemoryStream stream; using (FileStream fileStream = new FileStream("Image/2.png", FileMode.Open)) { int len = (int)fileStream.Length; byte[] buf = new byte[len]; fileStream.Read(buf, 0, len); stream = new MemoryStream(); stream.Write(buf, 0, len); } return await Task.FromResult<FileResult>(File(stream.ToArray(), "image/jpeg")); }

测试

前端展示

或者，根据返回值动态加载

``` axios({ url:"https://localhost:7207/api/WeatherForecast/GetPic", methodL:"get", responseType:"blob" }).then(res=>{ const {data,headers} = res const blob = new Blob([data],{type:headers["Content-Type"]}) pic.value = window.URL.createObjectURL(blob) })

```