„OAuth 2.0“ yra standartas, leidžiantis trečiųjų šalių programoms saugiai pasiekti duomenis iš žiniatinklio programų. Galite naudoti jį norėdami gauti duomenis, įskaitant profilio informaciją, tvarkaraščius ir kt. kuris priglobtas kitose žiniatinklio programose, pvz., „Facebook“, „Google“ ir „GitHub“. Paslauga gali tai padaryti vartotojo vardu, neatskleisdama jo kredencialų trečiosios šalies programai.
Sužinokite, kaip įdiegti „OAuth“ „Express“ programoje, naudodami „GitHub“ kaip „OAuth“ teikėją, atlikdami kelis veiksmus.
OAuth srautas
Įprastu OAuth srautu jūsų svetainė suteikia vartotojams galimybę prisijungti naudojant savo trečiosios šalies paskyrą iš teikėjo, pvz., „GitHub“ ar „Facebook“. Vartotojas gali pradėti šį procesą spustelėdamas atitinkamą prisijungimo prie OAuth mygtuką.
Tai nukreipia juos iš jūsų programos į „OAuth“ teikėjo svetainę ir pateikia sutikimo formą. Sutikimo formoje yra visa informacija, kurią norite pasiekti iš vartotojo, kuri gali būti jo el. laiškai, nuotraukos, tvarkaraščiai ir kt.
Jei vartotojas patvirtina jūsų programą, trečioji šalis nukreips juos atgal į jūsų programą su kodu. Tada jūsų programa gali pakeisti gautą kodą į prieigos raktą, kurį ji gali naudoti, kad pasiektų turimus vartotojo duomenis.
Šio srauto įgyvendinimas „Express“ programoje apima kelis veiksmus.
1 veiksmas: kūrimo aplinkos nustatymas
Pirmiausia sukurkite tuščią projekto katalogą ir cd į sukurtą katalogą.
Pavyzdžiui:
mkdir github-app
cd github programa
Tada inicijuokite npm savo projekte vykdydami:
npm init -y
Ši komanda sukuria a package.json failą, kuriame pateikiama išsami informacija apie projektą, pvz., pavadinimas, versija ir kt.
Šioje pamokoje bus naudojamas ES6 modulių sistema. Nustatykite tai atidarydami savo package.json failą ir nurodydami "tipas": "modulis" JSON objekte.
2 veiksmas: Priklausomybių diegimas
Kad serveris tinkamai veiktų, turėsite įdiegti keletą priklausomybių:
- „ExpressJS“: „ExpressJS“ yra „NodeJS“ sistema, teikianti patikimą žiniatinklio ir mobiliųjų programų funkcijų rinkinį. Naudojant Express supaprastins serverio kūrimo procesą.
- Axios: Axios yra pažadais pagrįstas HTTP klientas. Jums reikės šio paketo, kad pateiktumėte POST užklausą dėl prieigos prieigos rakto prie GitHub.
- dotenv: dotenv yra paketas, įkeliantis aplinkos kintamuosius iš .env failo į procesą.env objektą. Jums reikės norint paslėpti svarbią informaciją apie jūsų programą.
Įdiekite juos paleisdami:
npm diegti išreikšti axios dotenv
3 veiksmas: „Express“ programos kūrimas
Tau reikia sukurti pagrindinį Express serverį tvarkyti ir teikti užklausas OAuth teikėjui.
Pirmiausia sukurkite an index.js failą jūsų projekto šakniniame kataloge, kuriame yra:
// index.js
importuoti išreikšti iš "išreikšti";
importuoti aksios iš „aksios“;
importuoti * kaip dotenv iš „dotenv“;
dotenv.config();konst programa = express ();
konst prievadas = procesas.env. UOSTAS || 3000
app.listen (port, () => {
konsolė.log(„Programa veikia prievade ${port}`);
});
Šis kodas importuoja greitąją biblioteką, sukuria greitąjį egzempliorių ir pradeda klausytis srauto prievade 3000.
4 veiksmas: maršruto tvarkyklių kūrimas
Norėdami tvarkyti OAuth srautą, turėsite sukurti dvi maršruto tvarkykles. Pirmasis nukreipia vartotoją į „GitHub“ ir prašo leidimo. Antrasis tvarko peradresavimą atgal į jūsų programą ir pateikia prieigos prieigos rakto užklausą, kai vartotojas leidžia jūsų programai.
Pirmasis maršruto tvarkytojas turėtų nukreipti vartotoją į https://github.com/login/oauth/authorize? parametrus.
Į „GitHub“ „OAuth“ URL turėsite perduoti būtinų parametrų rinkinį, kuris apima:
- Kliento ID: tai ID, kurį gauna jūsų „OAuth“ programa, kai užsiregistravo „GitHub“.
- Taikymo sritis: tai nurodo eilutę, kuri nurodo, kiek prieigos prie vartotojo informacijos turi „OAuth“ programa. Galimų taikymo sričių sąrašą galite rasti GitHub OAuth dokumentacija. Čia jūs naudosite „skaitykite: vartotojas” apimtį, kuri suteikia prieigą skaityti vartotojo profilio duomenis.
Pridėkite šį kodą prie savo index.js failas:
// index.js
app.get("/auth", (req, res) => {
// Saugokite parametrus objekte
konst params = {
taikymo sritis: "skaitykite: vartotojas",
kliento_id: procesas.env.CLIENT_ID,
};
// Konvertuoti parametrus į URL koduotą eilutę
konst urlEncodedParams = naujas URLSearchParams (params).toString();
res.redirect(` https://github.com/login/oauth/authorize?${urlEncodedParams}`);
});
Šis kodas įgyvendina pirmąjį maršruto tvarkyklę. Jis saugo reikiamus parametrus objekte, konvertuodamas juos į URL koduotą formatą, naudodamas URLSearchParams API. Tada jis prideda šiuos parametrus prie GitHub OAuth URL ir nukreipia vartotoją į GitHub sutikimo puslapį.
Pridėkite šį kodą prie savo index.js failas antrajam maršruto tvarkytojui:
// index.js
app.get("/github-callback", (req, res) => {
konst {kodas} = req.query;konst kūnas = {
kliento_id: procesas.env.CLIENT_ID,
kliento_paslaptis: procesas.env.CLIENT_SECRET,
kodas,
};leisti prieigos raktas;
const options = { headers: { priimti: "programa/json" } };
aksios
.post("https://github.com/login/oauth/access_token", korpusas, parinktys)
.then((atsakymas) => response.data.access_token)
.ten((žetonas) => {
accessToken = prieigos raktas;
res.redirect(`/?token=${token}`);
})
.sugauti((err) => res.status(500.json({ err: err.message }));
});
Antrasis maršruto tvarkytuvas ištrauks kodas grįžo iš „GitHub“. req.query objektas. Tada jis sukuria POST prašyti naudojant Axios į " https://github.com/login/oauth/access_token" su kodu, kliento_id, ir kliento_paslaptis.
The kliento_paslaptis yra privati eilutė, kurią sugeneruosite kurdami „GitHub OAuth“ programą. Kai prieigos raktas sėkmingai gautas, jis išsaugomas kintamajame vėlesniam naudojimui. Galiausiai vartotojas nukreipiamas į jūsų programą su prieigos raktas.
5 veiksmas: sukurkite „GitHub“ programą
Tada turėsite sukurti „OAuth“ programą „GitHub“.
Pirmiausia prisijunkite prie savo „GitHub“ paskyros, tada eikite į Nustatymai, slinkite žemyn iki Kūrėjo nustatymaiir pasirinkite „OAuth“ programos. Galiausiai spustelėkite „Užregistruokite naują paraišką.”
„GitHub“ pateiks jums tokią naują „OAuth“ paraiškos formą:
Užpildykite reikiamus laukus norimais duomenimis. „Pagrindinio puslapio URL" turėtų būti " http://localhost: 3000”. Tavo "Prieigos grąžinimo URL" turėtų būti " http://localhost: 3000/github-atskambinimas“. Taip pat galite pasirinktinai įjungti įrenginio srautą, kad galėtumėte įgalioti naudotojus naudoti programą be galvos, pvz., CLI įrankis arba Git kredencialų valdytojas.
Įrenginio srautas yra viešosios beta versijos ir gali keistis.
Galiausiai paspauskite Užregistruoti prašymą mygtuką.
„GitHub“ nukreips jus į puslapį su jūsų kliento_id ir galimybė sugeneruoti savo kliento_paslaptis. Nukopijuokite savo kliento_id, sukurkite savo kliento_paslaptisir nukopijuokite jį.
Sukurkite .env failą ir saugoti kliento_id ir kliento_paslaptis jo viduje. Pavadinkite šiuos kintamuosius atitinkamai CLIENT_ID ir CLIENT_SECRET.
Dabar jūsų OAuth srautas baigtas ir dabar galite pateikti užklausas naudodami prieigos raktą, kad galėtumėte skaityti vartotojo duomenis ( apimtis nurodėte anksčiau).
„OAuth 2.0“ svarba
OAuth 2.0 naudojimas programoje labai supaprastina autentifikavimo eigos diegimą. Ji apsaugo jūsų klientų naudotojų duomenis naudodama Secure Sockets Layer (SSL) standartą, užtikrindama, kad jie liktų privatūs.
