topic Re: Sap Build Qr Code Generator in Application Development and Automation Discussions

Sap Build Qr Code Generator

fatihhan_aybirdi — Wed, 03 Apr 2024 06:41:08 GMT

Hey, Im currently trying to code a qr code generator by input data per SAP Build apps i tried calling an api also tried require to generate yet. Im facing the issue that it either doesnt understand the api or doesnt understand my code.

Re: Sap Build Qr Code Generator

Koni — Mon, 24 Jun 2024 19:17:14 GMT

Hello fatihhan_aybirdi,

your second screenshot shows that the output is "undefined".
You have to decide what type should the QR code be.
Inside the "output" configurations you have to define it (make it fit your data type).

My experience so far with QR codes is:
If you get the QR code as an IMG url, choose the IMG url to display it.
If you get the QR code back as an SVG+XML data string, use the "Dynamic SVG Image" element from the market place.

I experienced issues with the SAP Build Apps Preview app. It worked flawlessly inside the browser on the Desktop(Laptop) device. But the mobile device wasn´t working (iOS).
Using the Dynamic SVG Element made it work on mobile, too!

Hope that helps.

Re: Sap Build Qr Code Generator

mihaly-toth-nc — Thu, 27 Jun 2024 12:31:42 GMT

Just a quick look at your first image (where you have the script that actually prepares the qr code) you seem to lack the .makeCode() method.

So what you have written is this part:

```
const qrcode = new QRCode("test", {
text: "https://google.com",
width: 128,
height: 128,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});
```

But this just creates the object of the qr code, that will not yet actually generate the qr code. At least as per the docs based on a quick google search here: qr code js by davidschimjs
So my suggestion that instead of the
```
return qrcode;
```
write:
```
return qrcode.makeCode();
```

I have not tried it yet, but as far as I can see in the codepen on the docs it returns a base64 string. So make sure to handle that in your code or the logic canvas accordingly.
Suggestions:
1. Turn the base64 code into a blob and return the blob url in js.
2. Return the base64 string and use a 'write file' flow function where you actually store that as a local file and can use it in the image preview. Or you can also upload it to storage if that's something that you would need to do.

Let me know if this helps.

PS, I like the way how you utilise the 'globalThis', I was not aware of that prior to your post. Does the globalThis work on the native version of the apps (preview and build) or only on the web runtime?