How to generate dynamic URLs based on input?

Hey guys,

I am developing a simple QR-code validation feature on my app and would like to ask for help.

There are two sides: Store and Customer. The QR Code validation is used to add points to a loyalty program.

1 - The Store employee inputs a number of points and generates a QR Code (using the app on his phone).

2 - The Customer then scans this QR Code with his phone (using the app) and automatically gets the corresponding number of points added to his account.

For this to work, I would like to be able to generate a custom URL based on the number of points and set this as the URL of the generated QR Code. Then, when the customer scans it, it will open the URL and automatically call the addPoints method.

I thought of something like:
So that then all I need is to extract the “points=110” part - but no idea how to generate this URL dynamically (according to the number of points).

Do you know how I could achieve this? (or have any other suggestion about this feature)


something like this? :joy:

const url = '' + numPoints;

Depending on if you’re worried about people exploiting the system, (since a simple url with points in it is super easy to exploit), you should think about the url containing a one-time token created by the store and claimed by the customer.

Have you already got a client side router?

1 Like


I ended up doing the following:

1 - Created 2 params and 1 queryParam for the URL:
Params: type of operation (add/remove points) and token (random token generated just for this)
queryParams: number of points
2 - Created a method that validates that the token exists and triggers the main method (that will add or remove points)
3 - The main method also removes the token (so that no one can use it again later)
4 - Created a route that corresponds to the URL and triggers all the action inside template helpers

If anyone ever needs something similar, I can share my code.

1 Like