How the Heck Do API Keys Work?
ฝัง
- เผยแพร่เมื่อ 12 พ.ค. 2020
- This tutorial explains the logic behind API keys as well as providing a practical code demonstration of multiple ways to implement API keys in both the clientside JavaScript and in the backend with NodeJS and Express.
Code Repo from video: github.com/prof3ssorSt3v3/how...
Express JS tutorial playlist: • Quickstart with Expres...
![[TH] Esports World Cup : Knockout Stage Day 1](http://i.ytimg.com/vi/ES-vr-FarFg/mqdefault.jpg)
As someone who needs a step by step VISUAL walk through to understand concepts, this video was such a life saver. Thanks Steve, you've got a new subscriber!
I have looked for this very topic for a very long time. Thanks Prof, you have saved me!
This was very useful. It took me a long time to find a resource this useful so I appreciate you making this content.
Thanks for all this great content Steve! I really have no clue how only 24k people have stumbled upon this video. Such a great & thoughtful tutorial for beginners.
Amazing. Completed the videos today and learned a bunch.
man allow me to say, you have a really charming voice, it really gets me listening. Amazing tutorial voice
Excellent video, great job man. I'll def check out more of your content.
Thanks for this tutorial, finally some with the right knowledge to explain this concept clearly :D WELL DONE.
Lucid explanations, appreciate cha!
Excellently done and useful. Thanks.
Trying to build my SO's website. This is a boon, thanks man.
Thank you Steve. You are really a good human.
Plot twist: He's actually an AI!!11
Thank you very much, this kind of things are really interesting !!!
Useful Knowledge and good teaching => 100% likes
Thanks for this amazing video sir!
Good and helpful content
Thank you for sharing this knowledge
Love your explanation and I have subscribed to your channel, wondering also why you dont have at least 500k subs not fear, you're too good, after 2 years this still helping lots of people. Thank you
Thanks for the sub!
Where do you apply api keys on the application
@@karenbenge753 it completely depends on which api and how it is set up
Instant Subscribe.. Great Video
Perfect 😍🔥.. Thankssssssssss ♥️
I don't know if you made this for free, but it's fantastic, and the voice is very good.
I make all my videos for free
I don't even work on express but I still watched it, it was nice. I just have one question, I have noticed that the operators ( => or !==) are being formatted differently in your editor, is this a VSCode update or are you using a plugin. Also can you create a video/ series on Javascript module loaders and bundlers. That would be very helpful.
i'm using the font Jet Brains Mono, which has some great programming ligatures.
Thank a lot !!!
Also for those who are using this example make sure you have your URL in the browser is pointing to localhost instead of 127.0.0.1 or it will not work.
Thanks, Steve a good overview on the topic, especially loved seeing rate-limiting and restricting to a host. With sites that can only show the API key once, I presume that means that they aren't storing the API key on the server and hence it is more secure if the database is leaked, i.e. i've read about JWT. Is that a completely separate way of doing API authentication or essentially just an add on?
If you have one API then you could store it in an ENV variable. If there are thousands - one per user or domain then you would be saving them in a database.
JWT is a token that is generated on the server and given to the client after they validate themselves with a username and password. The client can then pass the token to the server with subsequent requests as proof that they have validated.
Btw, I have a video on JWT coming on Friday
hello steve may i ask? what extension did you used to hover the parameter value on 26:56?
I'm pretty sure that is the Intellicode extension.
Lovely stuff, I like how you compare origins to ensure keys are not abused. I wonder if it will suffice to protect a user's key, how secure would you say this implementation is?
This is really just explaining the process. If I were saving a collection of APIs then I would be encrypting and saving those in a database - MongoDB, MySQL, SQL Server, etc.
The API keys i would not have hard coded in the package.json file. They would be created through the command line or through an interface like the one in Netlify or AWS.
If I didn't have the host restriction on the API key then I would keep it on the server-side. As the developer using the API key I would store it on my server and make calls to the API server from my own server. The API key would be on my server, not in my client-side code.
@@SteveGriffith-Prof3ssorSt3v3 so basically the host restriction is secure enough for keys to be saved client-side? I really would love an API key implementation that allows my users to save their keys on the client-side giving no mind to the fact that others can see it.
@@duval2262 Any time you can hide the key is always better. If you can keep it on the server, that will be more secure.
@@SteveGriffith-Prof3ssorSt3v3 alrighty... Thanks for the awesome video and for responding to my questions.
What kind of database do you recommend do use to store and check the keys? I think the db has to be quite fast?
Any database is fine for storing the keys. The network connection is always going to be slower that anything the database does.
Great content!
Isn't it possible for both the API key and the host address to be spoofed, especially with programs like cURL that can add header information to HTTP requests.
Rule number one in all web development - NEVER trust anything that comes from the client. Validate everything.
In an introductory tutorial on APIs though we don't delve into server-side security best practices though.
Bottom line is that the client has to send identifying information to the server. That can be through cookies, POST data, querystrings, or headers. It is up to the server to manage and validate that information.
Yes, origin header can be faked easily. So abusers can still stole your client-side api key and abuse it.
I'm completely new to the Node js environment and having doubts about which method to use on the client-side, using template engines or the method that you are using?
Thanks in advance
There is no one answer to this question. Ask a hundred developers and you will get a hundred different opinions.
@@SteveGriffith-Prof3ssorSt3v3 Okay... Thanks for the response..much love
Thanks a lot, master. I wonder if I do exactly the same without express. Is it possible to do that using just
http module?
Absolutely.
@@SteveGriffith-Prof3ssorSt3v3 Thanks. You are great.
I have a note to watchers and a question.
Note to watchers: Although this is an introductory video and the way the base36 generator is implemented in it is understandable, in real projects never use Math.random() for api keys as it is easily predictable.
Question: If we give a website an API key, then their frontend developers have to use a proxy server to hide that API key from their users?
Thanks Steve for this video.
The newer crypto.randomUUID( ) method is a better approach for creating an API key now.
If you only have one value as the API key then it would be a best practice to use a proxy server and not store the value of the API key in your code on the client-side.
how did you define those api key in package.json and used as process.env.apik_key.never seen before
I'm using npm to run the "dev" script which is setting the ENV variables "API_PORT" and "API_MAX". Then those are available with NodeJS inside of process.env.
where do you store your Users info and APIKey? in a database table?
Typically yes.
@@SteveGriffith-Prof3ssorSt3v3 Thank you Steve, what a super helpful video tutorial very information and straight forward.... easy to follow, :)
it is best video on API. but can you tell us how can we setup on our local pc and how can we run server?
Setting up your computer depends on what you are trying to do and what technologies you are using. Node, PHP, Ruby, ASP.Net, Docker, Express, React, React Native, Cordova, Flutter, MongoDB, MySQL, etc.
Then there are cloud systems like Firebase or AWS or Atlas, that you can use for hosting solutions or data.
I have many videos on many topics and often talk about setting up for that technology
actually i want to download your code and run in my pc and after i want to convert it according to my needs but i can't run in my pc
@@SteveGriffith-Prof3ssorSt3v3
Thanks
Am I wrong in understanding that the API key is like a password generated by the server, which is given to the client that will need it to make requests in the future by providing it with each call? And that the origin is checked to make sure it is used by the original requester ?
@@alexvass yeah that is a simplified way of thinking about it.
its a great knowledge video, but what about the response header on browser, api key showing on browser side in response header.
The api key will only show in the Response headers if it is put there by the server-side script.
Can someone please explain the hostname check part.. I didn't get it 😅 Thank you in advance
If you want to make sure that a specific API key is only being used with a specific domain you can make that a restriction in the way that I showed.
How can we create apiKey using nestjs?
If you are talking about creating keys for your clients for your own website then you just need to be able to generate unique strings.
Nestjs is just Node so you can use a node npm module like uuid or there is now native JS support for crypto.randomUUID. you could use that as your API keys or have your own method like using a hash of identifying information for the user.
Should the api keys be encrypted to be saved to the database?
Usually API keys are saved as Environment Variables on the server.
@@SteveGriffith-Prof3ssorSt3v3 thank you for your response. So I have to save the api key for every user of my website as an env variable? This doesn’t sound like a workable solution tho. I might be wrong.
@@kennedydre8074 Sorry. I was thinking in the context of a single API key being used to request things from another API via the server.
If you are talking about yourself providing the API keys to validate against all the users coming to your site, then yes, encrypted in the database is the way to go.
Does it work If I have a open source API code?
Having an api key and how it is set up is entirely under the control of the person building the api. Whether it is open source or not has nothing to do with it.
@@SteveGriffith-Prof3ssorSt3v3 Thanks for replying, still I know nothing about it, I just learned how to create a basic api with express.js but once I have it public on github, don't know how to set it properly between being public and having private database access + API Key to allow database read only access
HOW CAN YOU USE ? req.header("x-api-key") .shouldnt it be req.header["x-api-key"]
There is often more than one way to get to things. req.headers['x-api_key']. req.headers.x-api_key. req.header('x-api-key')
Api key for circle?
What about api keys for circle?