0

In my angular application I'm integrating the google authentication where I need to display a QR code that is generated on server side.

How using angular $http.get I can receive the binary data of the image and assign it to an existing <img /> object using ng-src or something else?

What format shall be chosen to send data from server? raw binary .png data or maybe base64?

Any ideas are appreciated?

P.S. I cannot generate and store the image on server and just send the link.

Improve this question

1 Answer 1

Reset to default
0

I assume you are using the API from http://chart.apis.google.com/chart. If that's the case, you can simply set your fully formed query string as the img src, and it should load the png. I've done this before for creating bitcoin QR's

i.e. if this is your API query

http://chart.apis.google.com/chart?chld=L|1&choe=ISO-8859-1&chs=300x300&cht=qr&chl=bitcoin:4324234324dsf?amount=453%26label=dsfsdf%26message=sdfdsf

It should also work as the img src, even though it has no .png file extension. I'm not sure if it will work with ng-src though, so just create your image tag like

enter image description here

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

4 Comments

No, I'm using this url https://www.google.com/chart?chs=200x200&chld=M|0&cht=qr&chl=otpauth://totp/{0}%3Fsecret%3D{1} to get the QR code for a given identity, and using it on the client side would create a security breach as I'd have to let client know the Secret string used.
Then I would just add an endpoint that accepts your client params, generates the QR on google, publishes the file to S3, then returns a URL. You'll want to have some kind of intermediary file so that you're not calling Google APIs on every request for the file unless it's a once off thing.
That's exactly what I want to avoid, generation of intermediate files :)
I think I've found a solution here stackoverflow.com/questions/24235846/…, experimenting.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.