C#webapi接口返回图片内存流，页面用ajax获取给img

最新推荐文章于 2024-07-09 15:55:35 发布

明夕何夕wx

最新推荐文章于 2024-07-09 15:55:35 发布

阅读量5k

点赞数 4

CC 4.0 BY-SA版权

分类专栏： C# html js 文章标签： webapi C#

本文链接：https://blog.youkuaiyun.com/weixin_42524279/article/details/87879624

C# 同时被 3 个专栏收录

15 篇文章

订阅专栏

6 篇文章

订阅专栏

html

4 篇文章

订阅专栏

本文介绍了一种在API接口中将内存中的图片流转换为Base64字符串的方法，用于前端直接显示图片。通过具体代码示例，展示了如何生成微信支付所需的二维码，并将其转化为可在网页上展示的Base64格式图片。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

经过多方搜索，图片可以用base64这种方式显示（如下代码），所以可以在api接口中把内存流转换base64的字符串

document.getElementById('img').setAttribute( 'src', 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0 DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==' );

api接口控制器，我这里做的是微信扫码支付的二维码，

          [HttpGet]
        public IHttpActionResult WXPay(int order_id)
        {
            NativePay nativePay = new NativePay();
            string result = nativePay.GetPayUrl(order_id);
            QRCodeEncoder qrCodeEncoder = new QRCodeEncoder();
            qrCodeEncoder.QRCodeEncodeMode = QRCodeEncoder.ENCODE_MODE.BYTE;
            qrCodeEncoder.QRCodeErrorCorrect = QRCodeEncoder.ERROR_CORRECTION.M;
            qrCodeEncoder.QRCodeVersion = 0;
            qrCodeEncoder.QRCodeScale = 4;

            //将字符串生成二维码图片
            Bitmap image = qrCodeEncoder.Encode(result, Encoding.Default);
            //保存为PNG到内存流  
            MemoryStream ms = new MemoryStream();
            image.Save(ms, ImageFormat.Png);  
            byte[] arr = new byte[ms.Length];
            ms.Position = 0;
            ms.Read(arr, 0, (int)ms.Length);
            ms.Close();
            return Json( ApiResult.Success( Convert.ToBase64String(arr)));
        }

然后页面获取渲染，ajax我这里是封装了一下，你们自己写就好了，重点是data:image/png;base64

       // 测试微信支付接口
        $.mycore.httpAjax.get($.mycore.apiUrl.WXPay,
            { order_id: id },
            function (res) {
                var img = res.Message;
                $("#pay_img").attr("src", "data:image/png;base64,"+img);
            });