QR code from base64 encoded string Angular 2

Question

I have variable with base64 encoded string and I would like to decode it and after that, displayed it in a HTML template. I am using Angular 2 with typescript.

So I am looking for some base64 encode/decode library for Angular2/Typescript and some options to create an image from decoded string.

Thanks

So sorry, I mixed it up with Dart because I was working on Dart questions previously. — Günter Zöchbauer
– Günter Zöchbauer, Commented Apr 15, 2016 at 11:44
to encode/decode in base64 javascript's btoa()/atob() methods would be enough, to generate a QR code angular had this third party component but support for angular2 still seems under consideration — Ankit Singh
– Ankit Singh, Commented Apr 15, 2016 at 11:56

Loutocký · Accepted Answer · 2016-04-15 14:45:11Z

2

I solved it with something like this:

this.QRCode = "data:image/png;base64," + base64EncodedQRCodeInString;

this.QRCode is mapped to template by property binding, for example <img [src]="QRCode" />, it is not neccessary to decode it from base64. The browsers have the full support for base64 encoded strings.

edited Apr 15, 2016 at 14:45

answered Apr 15, 2016 at 14:35

Loutocký

8422 gold badges15 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

kris Over a year ago

How are you creating your base64EncodedQRCodeInString ? And what is "this" in your code here ?

Loutocký Over a year ago

base64EncodedQRCodeInString is from JAVA backend REST API, it was created by: ByteArrayOutputStream stream = null; stream = QRCode .from(generatedQRInput + delimeter + signWithKeyId.getId() + ";" + Base64Utils.encodeToString(signWithKeyId.getSign())) .withCharset("UTF-8") .stream(); if (stream != null) { return Base64Utils.encodeToString(stream.toByteArray()); }

Collectives™ on Stack Overflow

QR code from base64 encoded string Angular 2

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related