I want to make an API call to an external application from my knack application.
I can write my JavaScript snippet here Settings → API & Code.
The API I am accessing requires authentication, which means I need to supply an API key with the request. I am proficient in JavaScript.
My concern is how can I secure my API key.
The JavaScript is loaded on the client side (user’s web browser), so hard coding the API key in the code would be a security breach.
I came across this JavaScript code in the documentation.
Knack.getUserAttributes().values.field_1;
That gave me an idea that a solution might be to allow the user to store the API key as part of his profile, and then I access the API key from the user object (Knack.getUserAttributes().values.field_1;).
I have searched the forum to check if this case has been solved, but I haven’t found anything. Please advice me if there is an existing thread covering this topic. Thank you
What are your ideas to securely store and access API keys in a JavaScript snippet?
Personally, I think secret keys should always be stored in server-side code, ideally in environment variables.
If you don’t want to manage a server, you can use a third-party tool like Pipedream, write your code there, and then invoke it from Knack.
So the flow would go: Knack → Pipedream → Pipedream to External Application → Pipedream receives response from External Application and sends back to Knack.
Please note that users could execute Knack.getUserAttributes().values from the browser console and view the API key if stored there.
Yes, I agree, the server side should contain secret keys. That is the challenge when using a client side solution such as Knack.
Your suggestion of using Pipedream is great so that I dont have to maintain a server myself. I am using Zapier (an alternative to Pipedream as far as I understand Pipedream). That could work.
On this subject, I just put the secret keys in my server files, that are called by a php snippet inside a code snippet plugin (WPCode) in my WordPress website. And the Knack API JS code is working with it.
A free and secure solution.
Very fast to implement if you knew it, not like me.
We store API keys in the knack database as @KnackPros says not in an accounts object. We then use Knack API to retrieve the keys when needed. This works well and I can’t see there being a security issue with it unless I’ve missed something.
How do you call them, Craig?
I have to admit, I haven’t really searched for how to do that, but if you have info at your fingertips, I’d be interested in learning more.
That said, I don’t want to bog you down in something answered before. I’ll do some research…
end of week and have passing a lot of time on my CRM App and code… I am quite tired, but I will give you the main block of how I did that:
Take into account that my App is embedded inside a microsite page of my WordPress web site.
====== CODE =========
that’s all.
Than you have to adapt with your own id tables and fields.
I will delete this very long post in a few days. Please copy it for yourself. Maybe @NormandDefayette_CortexRD can explote it in many ways for the Knacksters.
It is the most challenging task I ever did in programing. All with the instructions and debugging of Perplexity and ChatGPT.
A note: in ChatGPT I found and used an agent called Knack Assistant. Very good quality.
You have an invisible menu (similar to what some of the advance features in KTL uses) and you have have views there that contain API keys. This is secure because only trusted users have access to those views/pages (by using User Roles.) Is that correct?
This is clever and sounds secure to me. Admittedly, I am a novice at web app security (learning every day though.)
That said, if I wanted code to use the API key for any user, this wouldn’t work since they don’t have access to the hidden menu views. Do I understand this correctly?
Yes Erik you are right, you couldn’t use this for non logged in users as this wouldn’t be secure. We also take this one step further and encrypt the api keys and use JS to decrypt them. This is because invisible menu/pages are still accessible to users who have access. Let me know if this would interest you and I’ll post the code and instructions.
