Build an API Proxy Server - Hide Your API Keys, Rate Limiting & Caching
ฝัง
- เผยแพร่เมื่อ 27 ก.ค. 2024
- We will use Node.js & Express to create a server in order to hide public API keys, add rate limiting and caching
💻 Code:
github.com/bradtraversy/node-...
Demo App:
traversy-weather-app.herokuap...
Node.js API Masterclass Course: (promo code: OCTOBER2021)
www.udemy.com/course/nodejs-a...
👇 Website & Courses:
traversymedia.com
💖 Show Support
Patreon: / traversymedia
PayPal: paypal.me/traversymedia
👇 Follow Me On Social Media:
Twitter: / traversymedia
Instagram: / traversymedia
Linkedin: / bradtraversy
Timestamps:
0:00 - Intro
2:48 - Dependencies & scripts
4:45 - Basic Express server
6:15 - Environment variables
8:00 - Create the route
10:40 - Request from server
15:50 - Forwarding query params
19:55 - Rate limiting
22:40 - API caching
24:28 - Use server with the client app
26:50 - Deploy to Heroku
30:20 - Environment variables on Heroku - วิทยาศาสตร์และเทคโนโลยี
![[LIVE] : ONE ลุมพินี 72 วันนี้!! คู่เอก "ก้องศึก vs โจอาคิม"](http://i.ytimg.com/vi/hT1EOSsRPac/mqdefault.jpg)
I forget if I mention it in the video or not, but you can also use serverless functions if you don't want to create your own server. You can use a platform like Netlify, AWS, Vercel, etc. I may do another video showing that method as well. Here is one I did 2 years ago on Netlify serverless functions - th-cam.com/video/drJwMlD9Mjo/w-d-xo.html
Hey Brad, please make some on AWS since it is "hot topic" at the moment. Many thanks :)
Hey Brad, can serverless functions also handle rate limiting and cache control as they are stateless and each request may go to different instances..?
Please do
Please make an instructional video Nx Angular NestJs (NAN) and Prisma please
does someone know what color theme extension he is using ?
This dude is just such a great guy lol I'm not even into programming/software engineering anymore but I still watch him just because how genuine and thoughtful this guy is, you go Brad!
Thanks :)
May I ask why you're not into programming anymore?
@@TraversyMedia 😊
@@bigtaskat-hand4742 Sure, after graduating from a bootcamp(Hack Reactor and I was at the top of my cohort) I realized this is not what I wanna do with the rest of my life despite being pretty decent at it and having multiple offers from big companies. For one, as idiotic as it may sound I didn't quite realize how much time I'll be spending crunching on a computer screen typing away for hours no end and killing my eyes and effectively end up making less than I was making at the time and it made me realize there is just so much more to life, plugging away my precious and finite time at some computer program wasn't for me.
For me, the goal never was getting a job or changing careers, I was doing pretty well before too, I just wanted to embark on a new journey cause I always wanted to be a software engineer, but didn't quite realize I didn't want the "corporate" side of it, I only enjoyed coding/solving problems, not doing it for money or working for a corporation.
Also, I wasn't much fund of the programming community as a whole, nothing wrong with these people, it's just I found most people to be monotone, mundane, dull, boring, socially awkward, not having much life outside of work etc... I'm naturally an extrovert and pretty hyperactive which didn't seem to be a good match to make friends in this field as most simply wanted to be locked in their rooms and code away
Basically I came to realize there is much more to life that I can explore by simply trying different things and being more active, outgoing, testing new waters, meeting new people, making business deals, etc... In other words, I'm a businessman by day and programmer by night
This is not to say these days I don't do anything with coding at all, in fact, I coded our entire CRM system for our family owned business(physical therapy staffing office) in Python and now the whole stuff uses it which quite streamlined and simplified the whole process, I also occasionally do bug bounties too(pen testing... exploits, binaries, networks, reverse engineer a malware, SQL injections, recon, XSS etc...) mainly because I like the rush when I spot and exploit a critical vulnerabilities in networks/servers, etc... but that's about it.
Hope I was able to answer your question.
@@ramsimon8045 if you don’t mind me asking, what do you do now instead for work?
Brad, your NodeJS videos are the platimum standard for clarity and practicality. Thank you for all the time and effort; it is appreciated.+
This is exactly what I have been looking for this whole week, thanks Brad
This is insane. I literally just head about this at work today and was planning on looking it up later. I refreshed the YT feed and out pops the exact video I need.
Haha, glad it could help
One word: amazeballs. Keep em coming. Love the format and that its short to the point. If I ever want to dig deeper theres almost always more info out there.
Damn, that rate limiting piece is awesome. I've always wondered how to do that!!
Just a few lines of code. Pretty cool
@@TraversyMedia is the ratelimiter separate for each client or is for overall usage ?
Hi traversy Media, this is my first time leaving a comment on one of your videos, I just want to tell you that for me you are one of the best we can find on youtube and I always recommend your channel (or udemy courses) to people who want to start learning web dev. All this to tell you that you are doing a wonderful job, keep going !
One tipp for you: Double clicking variable names, strings and other stuff usually selects exactly what you want. I've seen you drag-select a few times where could have just double-clicked. Saves a ton of time.
That is awsome video, many thanks for all your tutorials. I am also doing your 20 Vanilla JS project course on Udemy and I learned a lot from it. I am starting my first job as junior front end developer next week and a lot of my skills I learned from your extremely helpfull tutorials. Thanks Brad!
I've never been this overwhelmed how much things i have learn from you, thank you so much!
Hey Brad, thanks for all the overviews man, these have helped me on my development journey.
Wow 2 years later and this is still a masterpiece, learnt alot from you
You have really inspired and helped me in my tech journey
I want to thank you for the extremely helpful and straightforward video sir! I've watched tons of guides before but I could finally manage to hide my API key watching this video. You sir are a legend! Keep up the good work! Massive thanks again!
This was an awesome series. Thanks Brad. Your videos are priceless.
Hahaha This is exactly what I needed about 6 months ago. But I'm still going to watch it, I get to see how good a job I did. Traversy is the best!
Thanks for the tutorial! I'm a casual developer, and your videos help me keep my skills from rusting.
That's awesome
This was really useful and I feel empowered starting my own API proxy from scratch. Thanks for doing these!
Really enjoyed watching this tutorial, easily explained and so easy to understand.
I wish I had this tutorial a year ago. Setting up a proxy server is something every web dev should know.
I'll comment before i watch, cause i already know that this video is very useful this channel is one of the best NodeJS/FE dev stuff i've found on youtube so great work, again!
Thanks Brad, thanks for this amazing video 💝💝
This looks an interesting tutorial
Been searching serie about making own Api. Bless You buddy.
Thank you so much! I don't have any basic knowledge of backend dev, and my weather app, which is exactly as yours, is up and running now, and I learned to hide my API key.
Someone spammed my rest api 10000 times, yesterday.And I see this video. Best timing, thank you traversy
I have recently stumbled upon you and I have to say I like your videos!
This why i love traversy, very short video but useful
Thanks so much for this amazing tutorial, full of useful information. As always in your tutorials, learned new and useful stuff.
Excellent tutorial as always. Thanks!
This is so informative! Learned a lot from this vid. Thanks 🙌
Awesome tutorial as always! Brads tutorials are like classic albums where every song on the album is a hit lol. Also can anyone point me in the right direction on how to set another route for a totally different api call? I tried to add another route with the path to the different url but only the first api path i created works. One love!
Great video, Brad. Learnt a lot for it :D
Nice tutorial. Learnt a lot. Thanks Brad
Good comprehensive beginner friendly tutorial. 👏
this is really informative, thank you Brad! keep at it!
Thanks Brad, was really insightful !
Thanks, I have many things to learn from this tutorial, keep the good work
SUPER helpful!
I’ve been trying to make an iOS app and was worried about hiding my Twitter api info.
Time to fire up my own node server 😎
Great video!
does someone know what color theme extension he is using ?
Very good tutorial and very helpful, thank you very much.
Good explanation!
I'm doing my server side in Kotlin.
Coming from the man himself,
This is going to be hot!!!
Greetings from Tanzania 🇹🇿
Very Soon (Travery Media) Will Hit 2M
Huge Respect & Love From Small TH-camr ❤
what a great video thank you very much you also seem a lot happier than a few weeks ago and just overall seem better hope your doing ok man
best tutorial channel ever 👍
This is so helpful! Thanks. Perfect way to avoid using API keys in React
Thank you, I learned something new. 😃
I learned a lot via Codecademy but you explain the concept so simple and clear.
Brad, thanks. This is a great topic. I'm curious if this is the most popular way to protect those API keys or is serverless? Is IP whitelisting a contender, or can that actually be spoofed?
When fetching the params of the request (16:40), instead of url.parse(req.url,true).query we can just use req.query. At least this has always worked for me so far.
Yea, I was wondering why he didn't use that directly.
Thank you very much you helped me a lot , lots of love keep up the good work
Hi Brad, you use "url.parse()" method which is now legacy and deprecated.Wouldn't it be easier to use "req.query" instead of parsing "req.url", which is not a native Express property, it is inherited from Node’s http module.
great tut! love ya !
Very nice video! Learned several things!
Great Video! 😀Much appreciated!
thnks for the tuto.. it was just what i was looking!
Great tutorial, thank you, it's useful.
Can you make the second part, with using Redis as caching in this Express backend?
Awesome video, thanks!
Great tutorial, thank you!
Thank you @Traversy Media.
Thank you sir for another great video.
ive been trying to figure out how to actually do this properly thanks!!!
I learn alot buddy. Thanks man
Great sir going to try this code step by step
Very cool! From this video I learned that needle exists and that UrlParams can be parsed that way
Nice quick demo
wow, this a great video, what i need right now
Cheers man food for thought
this is what I was searching for. Thanks a lot. I am also searching for a firebase tutorial no matter if its paid or free . please bring a course on firebase and MERN or only firebase complet
Great tutorial, definitely learned a lot! Just one quest, hiding API key should improve the security of access to API from unauthorised requests, however, what stops me to use your web API to access further API?
The Request and IP come from your server, so the real API server will give access to any sources to do the request, for example from my server or application. It somehow feels like a backdoor. Usually private API service has IP locks, so a request can come only from a registered IP address. This method shown in the video kind of defeats that purpose, unless you add a restriction on your web server, that request can be done only from your web server and not other clients. Thanks.
How do you add such restriction with the app setup Brad has?
does someone know what color theme extension he is using ?
Always great content thank you
wow you watched that real quick didnt you
Big fan brad❤️
You're the goat Brad 🐐
brad you have no idea how much this can help me i can make so much just with this (also thank you SO much for including the site) as i dont know how to make good css stuff
speaking of css, do you have any resources on how to create good css to use and stuff? like round buttons, etc?
ty :D
Great video as always. Just have a quick question: why wasn't it necessary to have a Procfile to deploy to heroku?
almost zero to production, pretty nice and clean code.
Excellent idea thanks
Hi thanks, I'll perhaps use the same idea to reslve the problem of cors when working in a local dev environment, our proxy will transfer backend responses and add the header 'allow-cross-origin:*' it before sending to the front end browser. So the local React application talks only to the proxy and the proxy is the middle man with the REST servers.
Hey Brad Great Work !! I was wondering if you could do a tutorial about how to build and publish (NPM / ONLINE ) a CSS Framework !
Nice job 👍
Very fun tutorial
Nice one, thanks
need more video like this
So cool!
Brad the legend
God bless you brad. you're the best. quick one. I was lost when you introduced cache. any help would be appreciated
Thank you a lot for this video from Ukraine!
very usefull, you should make videos on those npm package too.
Whatever comes from Brad tastes like hot pizza:)))
The rate limiting is really really useful to me. My client suffered a catastrophic DDoS attack that overwhelmed his server sometime last month! It was a devastating moment for me.
@Brad, I like to know if I can use this kind of workflow with my py project??
Awesome!
yay! advanced stuff
Thanks Chief
I want to say I wish you posed to this a day ago. I literally spent the entire day learning fetch API since I couldn't get certain part
Awesome video! Is there any way to prevent someone from requesting my server endpoint? Even though the API key is stored in backend env securely, someone can still send request to my endpoint.
Hi. At 12:20 you can just destructure the process.env object. This is a new javascript feature.
great video. but sry to ask: wouldn't it be easier to do the server part in simple php?
This was uploaded 56 min ago.
Didn't have the time to watch yet.
Just dropped by to leave a like and a comment.
I'll come back to watch properly:)
Thanks plenty, Brad!
Thanks man. I appreciate the engagement
Love this channel. I binged probably 15 of your videos, several of them 2-3 times, actively followed and built a few projects, and bought a course in Udemy. That's really the least I could do :)
Thanks again. Much appreciated 🙏🙏
can you use a different limiter to each route?
Hello Brad, Thanks for this video very helpful. I want to make a request for a fullstack react & laravel course. I will be really grateful if this can be done. thanks alot for your good works.
Thanks for the video but im confused, wouldn't the client side need to to authenticate with the proxy api with a key?