.NET WebApi返回图片

参考

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

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

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

后端返回

核心代码

        [HttpGet]
        public async Task 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(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)
})