How to GET URL parameters from Web App URL

Howdy,

I am trying to use a Thunkable Web APP as a form.

The Web app URL will be passed with an additional parameter which I want to extract from the URL and set as a variable to be used later in the Thunkable app.

I am aware that I could use Javascript URLSearchParams to get this information, however I am not aware of any code blocks to run native javascript in Thunkable (I appreciate this is not really in the spirit of code free application building).

Is there away way to do this using the code blocks in Thunkable?

Thanks in advance.

1 Like

Welcome to Thunkable.

You can use the Web Viewer component to view HTML files or run HTML files containing JavaScript code.

However, if all what you want to do is to check if the URL changed then you can just use the URL block of the Web Viewer which is much easier.

image

Thanks for the reply.
I am not sure I completely follow, forgive me.

The web app URL once published will look like this:
//thunkable.site/web-build/index.html?webAppId=aSh5eWvYq

I will append it with a parameter id, something like this:
//thunkable.site/web-build/index.html?webAppId=aSh5eWvYq&id=7510
This URL will be dynamically created in an email program and provided as a link in the email body.

When the app is opened using the above URL, I will use the block ‘When Screen 1 opens’ do this… I want to store the id number as a variable which I will then use in subsequent API calls to retrieve customer info.

The Web Viewer block I understand works like an iframe?
I could use this to run some Javascript, but I still then have to interact between the returned result from the javascript and Thunkable.

Surely there is an easier way to just get the id parameter from the top level URL of the Thunkable web app?

Many thanks.

1 Like

This needs an answer from one of @Thunkable_Staff

1 Like

This is a great idea @inspiredchoice70a (and I would highly encourage you to submit a feature request on out Github) but we don’t have any functionality for this at the moment.

In the future we’d love to add deep linking to native mobile apps and this sounds like a similar concept but for web apps. Unfortunately this won’t be something that gets added in the next month or two.

Can you tell us a bit more about the user journey please? You’re dynamically creating links…to track where your users are coming from? I feel like there’s probably a happy work-around to be found here if we had a bit more context.

Thanks!

1 Like

@domhnallohanlon
Hello all,

I am new to Thunkable so still finding my feet but I have successfully built out 2 apps (so far) which we will deploy in our business (I am enjoying the process of using Thunkable :slight_smile: )

  1. The first app allows customers orders ready for collection to be located in our holding bays. I use the Airtable API to either update an existing record, or create a new record by using a different call in Airtable .

Our operatives can then search by the customers order id or their postcode to show a list of orders ready for collection and direct them to the correct bay(s).

Finally we produce a confirmed collection with a photo using the camera which is then stored again in the Airtable record.

  1. The second app is used on a tablet in our reception to provide a customer interface for order id input. This changes the status of the Airtable record, alerts our staff and can be seen on App 1 above as the customer is on site.

One of our staff had an idea to incorporate a button in the confirmation email which is sent to the customer to allow them effectively bypass the reception interface by letting us know they had arrived from their email client.

Our warehouse software sends an email informing the customer their goods are ready for collection. I can dynamically append the url parameter to include the order id which can be passed to the browser upon clicking.

This order id matches the id I already use frequently in the above two apps .

I saw that Thunkable apps could be deployed as a Web App rather than specifically onto and IOS or Android device which gave me the idea to create a ‘webform’ using a Thunkable Web App. I knew that with most webforms you can prepopulate fields with UTM parameters, I was hoping to do something similar with Thunkable, however in this scenario I would use the parameter and store it as a variable,

In this app I could build out API call blocks similar to those I have already been using in the other apps to GET customer info from Airtable and then update the status using a PATCH call.

(BTW be able to build out interactive webforms in this way would be pretty cool…I could see a lot of uses for this, so having the ability to pass the parameters from the URL would be mandatory requirement )

So I’m not sure if you can help with a work around…

Many thanks.

1 Like

@domhnallohanlon

Did you mange to find any work around for this?

Many thanks.

If you just tried (just for the sake of curiosity) this example you provided you will immediately get the answer.

@muneer

I have no problem creating the URL with the ID parameter I need…

This whole thread is asking how to extract the UTM parameter in Thunkable so I can use it in subsequent Thunkable blocks…

1 Like