Scott
Scott

Reputation: 2760

Create QR Code Base64 and put in IMG tag of HTML

I get some JSON data and create a QR Code from it. I then want to convert that to a Base64 string and put it in an img tag in my html. However, the QR Code doesn't image is not created. This is how I try it:

// my string created from the JSON
string strInventoryData = string.Format(dataPortable, GeneratorID, MarketUnit);

// generate the QR Code
ZXing.Common.BitMatrix byteIMGNew = writer.encode(strInventoryData, 
                                           ZXing.BarcodeFormat.QR_CODE, 240, 240, null);
Bitmap bmp1 = new Bitmap(byteIMGNew.Width, byteIMGNew.Height);
Graphics g1 = Graphics.FromImage(bmp1);
 g1.Clear(Color.White);
 for (int x = 0; x < byteIMGNew.Height; ++x)
 {
    for (int y = 0; y < byteIMGNew.Width; ++y)
    {
        if (byteIMGNew[x, y])
           g1.FillRectangle(Brushes.Black, x, y, 1, 1);
        else
           g1.FillRectangle(Brushes.White, x, y, 1, 1);
    }
}

// create the base64 encoded image
System.IO.MemoryStream ms = new System.IO.MemoryStream();
bmp1.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg);
byte[] byteImage = ms.ToArray();
var SigBase64 = Convert.ToBase64String(byteImage);

// put it in the htm
strInnerData += "<td align='center' style='width:240px;height:240px'>
    <img alt='Embedded Image' src='data:image/png;base64,'" + SigBase64.ToString() + "' /></td>";

What am I doing wrong?

Upvotes: 2

Views: 13704

Answers (1)

Majo
Majo

Reputation: 116

this code works for me:

QRCodeWriter qrCodeWriter = new QRCodeWriter();
BitMatrix bitMatrix = qrCodeWriter.encode(message, BarcodeFormat.QR_CODE, 500, 500);    
ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
MatrixToImageWriter.writeToStream(bitMatrix,"png", outputStream);

String base64 = new String(Base64.getEncoder().encode(outputStream.toByteArray()));
...    
String strInnerData = "<td align='center' style='width:240px;height:240px'>"+
        "<img alt='Embedded Image' src='data:image/png;base64,'" + base64 + "' /></td>";

Upvotes: 5

Related Questions