JWT Authentication Node.js Tutorial with GraphQL and React

Ben Awad · 263K views · 2019 · 3:04:08

Open on YouTube

Web developmentSecurity & hackingtutorialdated

Why Stack Overflow recommends it

Stack Overflow users link it as a reference for the access-token-in-memory, refresh-token-in-httponly-cookie pattern when asking about JWT storage and cookie handling.

Recommended by 0 people across 0 different months, 2020 to 2022.

What it is

A three-hour fullstack tutorial by Ben Awad that builds JWT authentication from scratch using Node.js, TypeScript, GraphQL (Apollo), React and PostgreSQL. It covers issuing access tokens and refresh tokens and wiring them into a React client, with the code on GitHub.

What people said

Cites AgileDom · 2020-01 · Stack Overflow · on “How is JWT token authenticated?”

There are quite a few and fairly generalised questions here, so I've broken this down a bit... How does JWT know that a token is valid and not an imposter token? When you submit a request to your server, a JWT is attached to the headers of that request. This JWT has been previously provided by the server (upon authentication) and is usually stored in localstorage or cookies, in order to persist sessions. One can then use the "jsonwebstoken" package (server side) to determine the validity of a token to a particular resource. The JWT package will decrypt the token and compare its signatures. This is done by comparing the secret key, which should never be exposed client side This is one variabl

Cites amaster · 2020-03 · Stack Overflow · on “How worried should I be about opening up a JWT to an XSS vulnerability?”

I am building a node.js web application with react for the the GUI and graphQL served with Apollo for the back-end connecting to a RDS (MySQL) instance on AWS. I am authenticating users and then returning JWTs. I have it figured out on how to renew/expire tokens, but now I am being faced with the question where to save it on the client side when a user visits the site... There are two main concepts with a third being a hybrid model. 1) Store it as localStorage with JavaScript as described on HowToGraphQL [LINK] 2) Store it in a Cookie with http-only set to true as described in the afore mentioned article as a cationary reference to Randall Degges [LINK] There is another alternative to store

Cites Gwinter · 2022-07 · Stack Overflow · on “How to use cookies between two docker containers (docker compose)”

Graph of network structure [LINK] I am following the flows inspired by these Ben Awad videos: [LINK] [this video] . The general pattern is access-token in memory, refresh token as httponly cookie*. This seems pretty secure and dev friendly. However since both my node frontend and my api backend are dockerized: during SSR I want to use the local connection to the backend, not through the DNS. By default this is a bridge network. This comes with a problem. Since the internal uri of the backend is [LINK] not [LINK] (or DNS name in production), the cookie does not apply to that domain, even though it really is the same app as we got the cookie from. So: what is the best solution, and how do I impleme