Is it possible to pass variable data to set the value of a QueryParameter? I’d like to be able to pass an API key that’s entered by the app user.
Yes… variables are your key. The join option in text is great to add variables together with predetermined elements to create a string for the Web component
So, I set them via the “Web API” “set body to” function block and then set the parameter and value?
the parameter is “access_token”, so do I merely set the web_api body to “access_token=xxxxx”? I tried that and it didn’t work
In my experience, the WebAPI component is broken and is not sending headers or body (I’m setting up a test server to add to the bug that I opened), but query parameters are sent fine. (EDIT: yes it is working; we need to set the Content-Type header manually, otherwise node.js express will not interpret the headers and body correctly)
Query parameters are not in the body however, so even if that was working, your attempt would not. Query parameters are (not exactly, but for the sake of simpleness) just part of the URL. So you can set the URL to https://thetargetserver.com/?access_token=xxxxx&someotherparam=something%20else
You can do this by concatenating the strings, simple example below (should) work (I’ve not tested, developed it quickly just now to show ya so there may be bugs (other than the fact that it’s unsafe due to direct user string concatenation):
Point of clarification – query parameters are part of the URL in GET calls, but it’s my understanding that query parameters are in the body for POST calls. Am I wrong? Also, I do set the Content-Type header. However, I noticed I had incorrectly added the value and I’m hoping “application/w-www-form-urlencoded” is correct.
We’re being caught up in terminology here; I’m no expert but as far as I know, we call query parameters the stuff that goes after the ? in the URI - this is because the URI is the query and the stuff that comes after the ? are the parameters. The stuff that we usually POST is the body which, as far as I know, we just call the body since it’s contents are not “standard” - they might be some sort of parameters or they might just be binary data or anything else - so we GET with parameters and POST with body (although that’s really just the “correct” implementation, both methods will actually have all the information available on the server side).
In any case; you are probably right in that what you want to send should go in the body (since you’re talking about the POST method). Since you need to send it url encoded, I THINK THunkable does that automagically.
So you should try:
- in the Web API component’s definition, add a header called “Content-Type” with the value that you mentioned is expected “application/x-www-form-urlencoded” (double-check spelling and everything)
- in blocks, set the WebAPI’s body to the text that you want
- Call the POST method.
If it doesn’t work, there are services online that may help by replying back exactly what you posted (eg. point your WebAPI component to one of those test services and then print their response to a textbox). Example project: https://x.thunkable.com/copy/e1e499726756be82d83979fe0831fbbc
(you’ll notice that this project is pointing to httpbin.org which will reply back the request that we send…)
edit: corrected the content type as mentioned (I’m really just copy/pasting yours here, I only really use json with my WebAPIs 
)
1 Like
Yes, I’ll test, again, this evening. It might have failed due to a mis-typed Content-type. However, I’m testing with a simple garage door app and don’t want to crush my wife or her car!
Being able to POST to a API is extremely important for my production apps and I don’t want to hard code the access token for security reasons.
I appreciate your advice and I’ll reply with the results of further testing.
NOTE – I believe the content type is “application/x-www-form-urlencoded”, not what you suggested above.
heheh yeah, OK sounds like you need a solid solution
The only WebAPI parameters that need to be hardcoded in Thunkable (as far as I see) are the headers (I opened a feature request for setting headers with blocks today); if your server accepts the access token as a query parameter or in the body of the request, then you should be able to do it without much problems.
Fiddle around with the example project that I sent; I think it should clarify things (it really helped me debug the problem that I was having with the blank body)
OK. It works just fine, thankfully. I’m guessing my error in entering the heading content_type was the problem. Instead of hardcoding the secret API key into the application, I can have the user enter it…well an encoded version of it, so they don’t know the actual key. I can then decode it in the app. Woohoo!!!
The best practices to do so are described here I suppose Web APIs Blocks | Drag and Drop | Thunkable Docs
Now we have better options Web APIs Blocks | Drag and Drop | Thunkable Docs