twitter-api-v2-user-oauth-flow-example
twitter-api-v2-user-oauth-flow-example copied to clipboard
Learn how to use twitter-api-v2 in a user login flow context inside a real world Express application.
twitter-api-v2-user-oauth-example
This project shows you how to make a simple 3-legged OAuth flow, with both PIN code and callback support.
Requirements
Packages
Install all packages of project, configure .env with required properties, then start TypeScript compiler.
npm i
cp .example.env .env
# ...configure .env with consumer keys
# then start the server
npm run start
Twitter app config
- Copy
.example.envto.envfile - Add your consumer key + consumer secret to
.envfile - Ensure
http://localhost:5000/callbackis present in allowed callback URLs, inside your Twitter application settings (in developer portal).
Testing the app
Navigate to http://localhost:5000 to test callback-based flow.
Navigate to http://localhost:5000/pin-flow to test PIN-based flow.
How it works
Callback flow
- It generate a authentification link (
routes/callback.ts,router.get('/')) that renders intoviews/index.ejs. - User clicks link, and is redirected to
routes/callback.ts,router.get('/callback')route. - Route use stored tokens into session to generate definitive access token, then renders
views/callback.ejswith access tokens data.
PIN flow
- It generate a authentification link (
routes/pin.ts,router.get('/pin-flow')) that renders intoviews/index.ejs. - User clicks link, opening the auth invite in a new tab, that shows a PIN code when acceptation is made.
- User enter PIN manually into appeared input, then triggers
routes/pin.ts,router.get('/validate-pin')route on button click. Information about login is printed on screen.