Feedback: the QR code doesn't change after you change the text + use …

…byte[] and Uint8Array as transferable.
ilonatommy · Jan 9, 2024 · fba92b8 · fba92b8
1 parent 51b2644
commit fba92b8
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 7 deletions.
diff --git a/dotnet/Program.cs b/dotnet/Program.cs
@@ -3,6 +3,7 @@
 using System;
 using System.Runtime.InteropServices.JavaScript;
 using QRCoder;
+using System.Linq;
 
 // https://github.com/codebude/QRCoder
 
@@ -13,17 +14,17 @@ public partial class QRGenerator
     private static readonly int MAX_QR_SIZE = 20;
 
     [JSExport]
-    internal static string Generate(string text, int qrSize)
+    internal static byte[] Generate(string text, int qrSize)
     {
         if (qrSize >= MAX_QR_SIZE)
         {
             SendErrorMessage($"QR code size must be less than {MAX_QR_SIZE}. Try again.");
-            return "";
+            return Array.Empty<byte>();
         }
         QRCodeGenerator qrGenerator = new QRCodeGenerator();
-        QRCodeData qrCodeData = qrGenerator.CreateQrCode("The text which should be encoded.", QRCodeGenerator.ECCLevel.Q);
+        QRCodeData qrCodeData = qrGenerator.CreateQrCode(text, QRCodeGenerator.ECCLevel.Q);
         BitmapByteQRCode qrCode = new BitmapByteQRCode(qrCodeData);
-        return Convert.ToBase64String(qrCode.GetGraphic(qrSize));
+        return qrCode.GetGraphic(qrSize);
     }
 
     [JSImport("QRGenerator.sendErrorMessage", "dotnetWorker.js")]

diff --git a/dotnet/dotnetWorker.js b/dotnet/dotnetWorker.js
@@ -18,8 +18,8 @@ self.addEventListener('message', async function(e) {
             const text = e.data.text;
             if (size === undefined || text === undefined)
                 new Error("Inner error, got empty QR generation data from React");
-            const image = assemblyExports.QRGenerator.Generate(text, size);
-            self.postMessage({ command: "generateQRCodeResponse", image: image });
+            const imageBytes = assemblyExports.QRGenerator.Generate(text, size);     
+            self.postMessage({ command: "generateQRCodeResponse", image: imageBytes.buffer }, [imageBytes.buffer]);
         default:
             self.postMessage(e.data.command);
             break;

diff --git a/dotnet/main.js b/dotnet/main.js
@@ -22,7 +22,10 @@ export async function setUpWorker() {
             case "generateQRCodeResponse":
                 if (e.data.image === undefined)
                     new Error("Inner error, got empty QR image from worker");
-                document.getElementById("qrImage").src = `data:image/bmp;base64, ${e.data.image}`;
+                let uint8Array = new Uint8Array(e.data.image);
+                let binaryString = Array.from(uint8Array).map(byte => String.fromCharCode(byte)).join('');
+                let base64String = btoa(binaryString);
+                document.getElementById("qrImage").src = `data:image/bmp;base64, ${base64String}`;
             default:
                 console.log('Worker said: ', e.data);
             break;