Answered

Image Control removes everything after "key=" in Dropbox url.

Like (0) Share

Report

Posted on 29 Sep 2023 19:05:31 by weslijones

I have created an app that produces QR codes from Dropbox links using an external QR code API. The text output from the API is used as input to the "image property" of an Image Control. This generates a QR code image as expected. Dropbox links contain the text "key=" in the url (ex: https://www.dropbox.com/scl/blablabal?rlkey= ...?dl=0). This passes a code to Dropbox that allows the file to be viewed directly in the browser the link is opened in.

When I scan the QR code produced by the API directly the url opens as expected. The problem seems to occur when the QR code is rendered in the Image Control. When it is scanned and converted back to a url all the characters AFTER the text "key=" are removed (including the "=" sign). This also happens with any other url's containing the text "key=". Is there documentation on this property of Image Control or in Power Apps in general? I have looked and have not found anything yet. Is there a way to keep the characters after the text "key=" when creating a QR code using an Image Control so that the QR code renders properly?

All responses (2)

Answers (1)

Verified answer

weslijones on 04 Oct 2023 at 15:25:28

Like (0)

Report

Re: Image Control removes everything after "key=" in Dropbox url.

Hello SongYe

Thanks for your suggestion. The goal of the app is to remove the need to manually make and save each QR code image.

Here is the code I'm having the problem with. Paste this code into the "Image" property of an Image control. I have try this with 2 different API's quickchart.io and chart.googleapis.com.

Using quickchart.io (include the quotes)
"https://quickchart.io/qr?text=" & TextInput1.Text & "&size=" & Image1.Width & "&margin=1" & "&ecLevel=L" & "&format=svg"

Using chart.googleapis.com (include the quotes):
"https://chart.googleapis.com/chart?cht=qr"& "&chl=" & TextInput1.Text & "&chs=" & Image1.Width & "&chld=L"

The image control will display the QR code, but when it is converted back to text the information after "key" is removed.

BUT, I think I have found a solution :-)! Instead of using an Image control use a HtmlText control. Here is the code I have tested. This displays the QR code and when it is converted back to text the text information after"key" is also displayed. Paste this code into the "HtmlText" property of a HtmlText control.

Using quickchart.io (include the quotes)
"<img class='img-example' src='" & "https://quickchart.io/qr?text=" & TextInput1.Text & "&size=" & HtmlText1.Height & "&margin=1" & "&ecLevel=L" & "&format=svg" & "'>"

Using chart.googleapis.com (include the quotes)
"<img class='img-example' src='" & "https://chart.googleapis.com/chart?cht=qr"& "&chl=" & TextInput1.Text & "&chs=" & Image1.Width & "&chld=L" & "'>"
SpongYe 5,580 Super User 2025 Season 1 on 29 Sep 2023 at 19:48:20

Like (0)

Report

Re: Image Control removes everything after "key=" in Dropbox url.

Hi @weslijones

I can't really recreate the issue you have because your using a api.
But I tried to do it differently.

Via Adobe I created a QR code

I copied the URL

And added the url into my image control

Scanning the QR just gives me the same URL entered in the beginning.

Hope this helps.

-----------------------
PowerYsa Power Platform Enthusiast [LinkedIn] | [Youtube]

I love to share my knowledge and learn from others. If you find my posts helpful, please give them a thumbs up 👍 or mark them as a solution ✔️. You can also check out my [@PowerYSA] for some cool solutions and insights. Feel free to connect with me on any of the platforms above. Cheers! 🍻