Dodajte Instagram prijavu u svoju NodeJS aplikaciju pomoću PassportJS

Saznajte kako Instagram-ov API funkcionira s Oauthom i provedite potpun protok prijave pomoću MongoDB.

Danas ćemo naučiti kako dodati Instagram prijavu na NodeJS aplikaciju pomoću PassportJS (jedan od najpopularnijih načina upravljanja autentifikacijom u NodeJ-ovima). Naučit ćemo kako funkcioniraju Instagram-ovi API-ji i implementirati puni tijek prijave pomoću baze podataka (MongoDB).

Kako funkcionira prijava na Instagram?

Instagram koristi Oauth2.0 za autentifikaciju i autorizaciju. Instagram prijava može se implementirati za uobičajene aplikacije i aplikacije bez poslužitelja. Brzo ćemo razmotriti obje metode.

Prema standardnom Oauth2.0, Instagram API-ju potreban je pristupni_token za provjeru autentičnosti. Ti su pristupni_tokeni specifični za korisnika i vremenski ograničeni. Dakle, kada oni istječu u budućnosti, trebate zatražiti oznaku za osvježavanje.

Ispod su tri jednostavna koraka za dobivanje access_token za Instagram:

1- Izravni korisnik na Instagram URL autorizacije.

2- Korisnik se prijavljuje (ako već nije prijavljen) i dodjeljuje dopuštenja za pristup Instagram podacima.

3- Instagram će poziv preusmjeriti na vaš navedeni URL s parametrom koda gdje ćete taj kôd razmjenjivati ​​s access_token na strani poslužitelja.

Za aplikacije bez poslužitelja, Instagram će u URL za preusmjeravanje dodati access_token. (Ovo je manje sigurna metoda i ne preporučuje se).

Preduvjet

  • Čvor js
  • Izraziti JS
  • Putovnica JS
  • Registrirajte aplikaciju na Instagramu

Registrirajte aplikaciju na Instagramu

Prije nego što krenemo naprijed, moramo registrirati klijenta na Instagramu.

Idite na konzolu za programere na Instagramu i stvorite novu aplikaciju za klijenta. Jednom kada se registrirate, dobit ćete clientID i clientSecret.

Najvjerojatnije ćete upotrijebiti localhost za to. Tijekom registracije morate dodati URL za preusmjeravanje. Moja je,

http: // localhost: 3000 / auth / Instagram / povratni poziv

Možete odabrati svoj vlastiti, samo zapamtite, ako koristite localhost i port 3000 (zadani port NodeJs), vaš bi URL trebao početi s http: // localhost: 3000.

Problem s Captcha

Tijekom registracije nove aplikacije za klijenta mogli biste se suočiti s problemom captcha. Da biste to riješili, možete upotrijebiti dodatak Diable Content Security.

Prijavite se putem Instagrama

Koristit ćemo passport.js, PasspostJS je knjižnica koja ide u biblioteku za implementaciju različitih vrsta provjere autentičnosti u vašu aplikaciju. To je posredni softver za vašu NodeJs aplikaciju.

Kreirajmo ekspresnu aplikaciju pomoću.

izraziti insta-auth

Radi jednostavnosti, dodajte sljedeći kôd u app.js. Možete ga ponovno prilagoditi kad shvatite protok.

Instalirajte passpost-instagram

npm instalirati putovnicu-instagram

Uvezi potrebne datoteke

var Instagram = zahtjev ('putovnica-instagram'); const InstagramStrategy = Instagram.Strategy;

Inicijalizirajte putovnicu JS

Sada ćemo inicijalizirati PassportJs. Ako vaša aplikacija koristi sesiju (najvjerojatnije da jest), tada morate koristiti i sesiju putovnice. PassportJS će serializirati i deserializirati korisničke instance do sesije i od nje. Obavezno upotrijebite express.session () prije passport.session () da biste osigurali da je sesija prijave prijavljena u ispravnom order.passport.session () mijenja objekt req i promijeni vrijednost 'user' koja je trenutno id sesije (iz kolačića klijenta) u deserializirani korisnički objekt. U slučaju odjave, passportJs jednostavno uklanja informacije o korisnicima koristeći deserializeUser.

app.use (passport.initialize ()); app.use (passport.session ());
passport.serializeUser ((korisnik, učinjeno) => {done (null, user)}) passport.deserializeUser ((korisnik, učinio) => {done (null, korisnik)})

Putovnica Instagram Strategija

Različite aplikacije poput Instagrama, Twittera ili Googlea mogu imati različite metode autentifikacije. PassposJS povezuje različite mehanizme za provjeru autentičnosti u module koji se nazivaju strategijama. Za svoju aplikaciju koristimo strategiju Instagrama.

Za konfiguriranje Instagram strategije dodaćemo clientID, clientSecret, callbackURL i također ćemo proći metodu povratnog poziva za obradu autentifikacije.

passport.use (novi InstagramStrategy ({clientID: "YOUR_CLIENT_ID", clientSecret: "YOUR_CLIENT_SECRET", povratni pozivURL: "YOUR_CALL_BACK_URL"}, (accessToken, refreshToken, profil, završeno) => {}))

Koristimo bazu podataka (MongoDB) za spremanje podataka o korisniku i access_token. Provjerit ćete u svojoj bazi podataka ako Korisnik već postoji ili ne i stvoriti novi unos za nove korisnike.

passport.use (novi InstagramStrategy ({clientID: "YOUR_CLIENT_ID", clientSecret: "YOUR_CLIENT_SECRET", povratni pozivURL: "YOUR_CALL_BACK_URL"}, (accessToken, refreshToken, profil, učinjeno) => {User.findOne (' profile.id}, funkcija (err, korisnik) {if (err) povratni poziv (err);
if (korisnik) {return done (null, korisnik); // Provjerite da li korisnik već postoji}
const {id, puno ime, korisničko ime, profil_picture, bio, web stranica, broji: {medij, slijedi, follow_by}} = profile._json.data;
const new_user = novi korisnik ({instagram: {id, accessToken, puno ime, korisničko ime, profil_picture, bio, web stranica, broji: {medij, slijedi, follow_by}}});
new_user.save (funkcija (err, korisnik) {// spremanje novog korisnika u mongo if (err) {bacanje err;} return done (null, korisnik);}); }); }))

Konfiguracija ruta

Sada ćemo konfigurirati neke rute za stvaranje protoka prijave.

app.get ('/ auth / instagram', passport.authenticate ('instagram'));
app.get ('/ auth / instagram / callback', passport.authenticate ('instagram', {successRedirect: '/ profil', failRedirect: '/ prijava'}));

Uputit ćemo / auth / instagram u našoj aplikaciji da pokrenemo protok provjere autentičnosti u našoj aplikaciji. Ovo će pokrenuti našu provjeru autentičnosti na Instagramu preusmjeravanjem korisnika na Instagram (ako već nije prijavljen).

Ispod haube

Da vidimo što se događa ispod haube? Nakon što nazovete provjeru autentičnosti putovnice, ona će se prebaciti na Instagram, nakon što korisnik završi, Instagram će udariti naš URL za povratni poziv s kôdom, PassportJS će taj kôd zamijeniti za access_token na strani poslužitelja. Ako ne koristimo putovnicuJS, to moramo učiniti sami. PassportJS interno vrši autorizaciju i provjeru autentičnosti za nas.

Nakon što PassportJS dobije access_token, naša metoda povratnog poziva koja je kod nas instagramInit, pozvat će se slučaj da dovršimo postupak prijave.

const instaConfig = {clientID: CLIENT_ID, clientSecret: CLIENT_SECRET, povratni pozivURL: CALLBACK_URL};
const instagramInit = funkcija (accessToken, refreshToken, profil, povratni poziv) {User.findOne ({'instagram.id': profile.id}, funkcija (err, korisnik) {if (err) povratni poziv (err);
if (korisnik) {return callback (null, korisnik); // Provjerite da li korisnik već postoji}
const {id, puno ime, korisničko ime, profil_picture, bio, web stranica, broji: {medij, slijedi, follow_by}} = profile._json.data;
const new_user = novi korisnik ({instagram: {id, accessToken, puno ime, korisničko ime, profil_picture, bio, web stranica, broji: {medij, slijedi, follow_by}}});
new_user.save (funkcija (err, korisnik) {if (err) {baciti grešku;} uzvratni poziv (null, korisnik);}); }); };
passport.use (novi InstagramStrategy (instaConfig, instagramInit));

Ovdje provjeravamo imamo li korisnika već u našoj bazi podataka ili ne, Ako korisnik ne postoji, stvorit ćemo korisnika i proslijediti povratni poziv PassportJS, koji zatim serializira i deserializira zahtjev i interno prosljeđuje zahtjev na / profil.

app.get ('/ profil', secureAuthentication, (zahtjev, odgovor) => {const {instagram} = request.user; odgovor.render ('profil', {korisnik: instagram});});

Prvo ćemo nazvati secureAuthentication nakon što pogodimo / profil. Pogledajmo našu metodu secureAuthentication. Ova metoda je jednostavno provjeravanje da li je zahtjev ovjeren ili ne.

funkcija secureAuthentication (zahtjev, odgovor, sljedeći) {if (request.isAuthentication ()) {return next (); } odgovor.redirect ('/'); }

Ovo je naš puni protok. Također ćemo implementirati profilnu metodu za prikaz korisničkih informacija i način odjave.

app.get ('/ profil', secureAuthentication, (zahtjev, odgovor) => {const {instagram} = request.user; odgovor.render ('profil', {korisnik: instagram});});
app.get ('/ odjava', funkcija (req, res) {req.logout (); res.redirect ('/');});

Potpuni radni kod

Cijeli kod možete provjeriti ovdje.

Morate dodati preimenovati config-template.json u config.json i dodati svoje vjerodajnice, a također dodati i mongo URL. Možete koristiti mLab za korištenje oblaka mongo.

Zaključak

U tu svrhu ne trebate koristiti PassportJS, ali to je jedna od najpoznatijih knjižnica u ekosustavu čvora s više od 120.000 preuzimanja tjedno. Pruža više od 500 strategija za provjeru autentičnosti, te stoga postaje sveobuhvatno rješenje za upravljanje autentifikacijom.

U komentarima nam pokažite što gradite i javite nam ako se negdje zaglavite i rado ćemo vam pomoći.

Dodatni umak (Instagram privatni API-ji)

Osim službenih API-ja za integraciju vaše aplikacije s Instagram programeri su stvorili vlastite biblioteke za rad s Instagramom bez korištenja službenih API-ja. (Instagram API-ji su u početku bili jako loši, pa su mnogi programeri stvorili zaobilazno rješenje). Neke primjere možete pogledati ovdje i ovdje.

Bilješke

Instagram je počeo obustavljati podršku za API, a trenutna verzija API-ja bit će u potpunosti zastarjela do 2020. . Instagramovim API-jevima možete pristupiti putem Facebook programera za programere, iako trenutno podržavaju samo poslovne račune. Također, Instagram je nedavno pokrenuo Instagram Graph API (pristup putem Facebook programera za razvojne programere).

Izgradnja web ili mobilne aplikacije?

Crowdbotics je najbrži način za izgradnju, pokretanje i razmjenu aplikacije.

Programer? Isprobajte Crowdbotics Builder aplikacija za brzo skeniranje i implementaciju aplikacija s različitim popularnim okvirima.

Zauzet ili netehnički? Pridružite se stotinama sretnih timova koji grade softver s Crowdbotics PM-ovima i stručnjacima. Vremenska crta i troškovi s Crowdbotics Upravljanjem razvojem aplikacija besplatno.