Gmail QRcode workaround

So gmail, outlook, etc look at the email and block the qrcode from rendering so the user needs to do one more additional click.

My solution was to create a cloudflare worker that:

1) Takes the shopify link to the browser ticket (e.g. https://tangogarden.de/apps/events/ticket/243813/1W2Y_GQSKebyWN_6ZT9Y9A/)

2) From that url as shopify blocks the workers, strip the last part and get it from your url (https://www.eveyevents.com/243813/a/1W2Y_GQSKebyWN_6ZT9Y9A/)

3) Use the worker to fetch the base64 text and translate the encoded text into a png.

4) Return the png.

This worked for me after a few tests but on a single product (Tested on a Google Pixel 10 Pro and Gmail). The free tier of cloudflare should be fine for me but in your case it might be worth creating a more robust version of the feature. Curious to hear your thoughts on this hack.

Cloudflare playground test.

Best,

Vangelis

/* Inside the notification replace the suggested url by the tutorial with 
*
* From:
* 	<!--<img src="data:image/png;base64,{{ attendee.barcode_image }}" alt="Ticket QR Code" width="250">-->
* To:
*	<img src="https://qr-bridge.van-theodorakis.workers.dev/?url={{ attendee.ticket_url }}" 
*/