在用Delphi做Web后台的时，有时需要用到后台动态生成二维码图片，给前端使用，虽然前端可以通过js库生成，目前流行的有 QR码生成器（在线）、QRCode.js（支持本地）、 arale-qrcode（支持本地）等，生成的效果也都满意。但是这些js库都使用的是H5的cavas来画图，在一些早期的Android设备上不支持（例如：Android 5.1）。在这种情况下，就需要后台生成好图片，然后经过base64编码后发送给前端，从而实现图片显示支持部分低版本的设备。如果应用不考虑低版本，当然直接使用js库就是很方便的。

言归正传，delphi 做后台，生成好图片信息，通过base64传递到前端，前端经过解码，实现图片显示。

一、服务端：Delphi 代码示例（需要单元：System.NetEncoding）

// 1. 按照stream 返回数据MM := TMemoryStream.Create;MM.LoadFromFile('a3650.jpg');  //如果动态生成的图片，就完全不需要文件装载，直接编码输出即可MM.Position := 0;     //注意，指针要移到首位SetLength(B,MM.Size);MM.Read(B[0],MM.Size);MM.Free;S := TNetEncoding.Base64.EncodeBytesToString(B);S := S.Replace(#13,'').Replace(#10,''); //经过delphi Base64后的编码，会中间插入回车换行，主要时便于肉眼观察，js前端实际使用中时不需要的B := TEncoding.UTF8.GetBytes(S);   //给前端的是UTF8编码C.Response.StatusCode := 200;        //返回状态码C.Response.Close(B);                //返回编码后的图片数据到前端

 

<div><img :src="imgSrc" alt="">
</div>

axios.post('http://192.168.1.190/icenter/30001/J',{aaa:'123'},{headers: {'Content-Type': 'application/x-www-form-urlencoded'}}).then(res => {this.imgSrc = 'data:image/jpg;base64,' + res.data; //imgSrc 是Vue中 img 标签的src});

三、需要注意的地方：

1、delphi进行的Base64编码需要将中间的回车换行（#13#10）去掉；

2、对于前端img标签，src表示的是图片源，格式一定是：data:image/jpg;base64, + 后台返回的信息。

3、在测试中，建议自己做一个10x10的小纯红色图片，这样调试起来数据比较小，简单很多。