Povezovanje vašega Raspberry Pi s spletom: 9 korakov

2024 Avtor: John Day | [email protected]. Nazadnje spremenjeno: 2024-01-30 12:03

V tej lekciji se boste naučili ustvarjati spletno stran, zbirati podatke z uporabo svetovnega spleta in uporabljati API -je za objavo slik v Tumblrju in Twitterju.

Korak: Odjemalec in strežnik

Odjemalec-strežnik je v računalništvu model programske opreme, sestavljen iz dveh delov: odjemalca in strežnika. Oba komunicirata prek računalniškega omrežja ali skupaj na istem računalniku. Odjemalec je program ali računalnik s programsko opremo, ki se opira na zahtevo po storitvah strežniku. Strežnik je računalniški program ali naprava, ki lahko sprejme te zahteve, jih obdela in vrne odjemalcu zahtevane podatke. Včasih je težko ugotoviti, kaj je to pri delu s stroji, ki opravljajo več nalog hkrati. Tu je nekaj značilnosti, ki vam bodo pomagale ločiti stranko in strežnik.

Lastnosti odjemalca:

• Je prvi aktivni
• Pošilja zahteve strežniku
• Od strežnika pričakuje in sprejema odgovore
• Običajno neposredno komunicira s končnimi uporabniki z uporabo katerega koli uporabniškega vmesnika, na primer grafičnega uporabniškega vmesnika

Lastnosti strežnika:

• Sprva je pasivno
• Posluša, pripravljen se je odzvati na zahteve strank
• ko pride zahteva, strankam odgovori z zahtevanimi podatki
• Končni uporabniki običajno ne komunicirajo neposredno s strežnikom, ampak uporabljajo odjemalca.

Pogost primer odnosa odjemalca in strežnika je spletni brskalnik (odjemalec), ki zahteva in prejema datoteke spletnih strani, ki gostujejo na spletnem strežniku.

2. korak: Ustvarite lokalni spletni strežnik

Raspberry Pi lahko postane spletni strežnik z namestitvijo in zagonom strežniške aplikacije. Dve priljubljeni odprtokodni strežniški aplikaciji sta: NGINX (izgovorjen motor x) in Apache. V tej lekciji boste uporabili Apache, ker je od tega pisanja bolj dokumentiran. To olajša iskanje odgovorov na spletu, ko se učite.

Vaš Raspberry Pi bo gostil spletno mesto, do katerega lahko dostopa katera koli naprava v istem omrežju. Začnimo!

3. korak: Namestite Apache

Namestite paket apache2. Zastavica -y vam odgovori na varnostno vprašanje pred namestitvijo.

sudo apt -get namestite apache2 -y

Apache ima preskusno datoteko HTML, ki ustvari nadomestno spletno stran, s katero preizkusi namestitev. Ta preskusna datoteka HTML je v korenskem imeniku Apache. Apache je privzeto nastavljen, da v tem imeniku išče spletne dokumente za ustvarjanje vsebine v spletnem brskalniku. Če si želite ogledati to preskusno stran in potrditi, da je Apache res pravilno nameščen, jo povlecite v brskalnik tako, da vnesete ta naslov URL:

localhost/

Če je Apache pravilno nameščen, boste v brskalniku videli preskusno spletno stran Apache:

Poiščite IP naslov vašega Raspberry Pi

Naslov localhost lahko uporabite za dostop do spletne strani, medtem ko ste na Raspberry Pi. Za dostop do spletne strani iz drugega računalnika potrebujete naslov Raspberry Pi IP. Če želite poiskati vrsto naslova IP v LXTerminalu:

ifconfig

Lahko ga najdete tudi na namizju, če premaknete kazalec na simbol za sprejem WiFi.

4. korak: Ustvarite statično spletno stran

Vaš Raspberry Pi lahko zdaj gosti spletno stran in vso vsebino, ki bo na njej objavljena. Obstajata dve osnovni vrsti spletnih strani: statična in dinamična. Statična stran ima vsebino, ki se ne spreminja. Dinamična stran lahko prikaže spreminjajoče se podatke, kot so odčitki senzorjev ali spreminjanje časa in datuma.

Začnimo s statično stranjo. Če ga želite ustvariti, morate uporabiti jezik, imenovan HTML. Ko obiščete spletno stran, je prva stvar, ki jo vidite, verjetno stran index.html. Ta stran je privzeta stran, ki jo brskalnik prikaže, če druga stran ni navedena. Apache privzeto išče datoteko index.html tukaj:

/var/www/html

To se imenuje koren dokumenta in je skrita mapa. Namenjen je shranjevanju spletnih strani. Pojdite tja in si oglejte okoli:

cd/var/www/html

ls

Prikazana bo privzeta preskusna datoteka index.html. Če želite shraniti privzeto datoteko, jo z ukazom mv preimenujte v nekaj podobnega defaultIndex.html.

sudo mv index.html defaultIndex.html

če je ne želite shraniti, datoteko odstranite z ukazom rm:

sudo rm index.html

Zdaj lahko ustvarite in začnete urejati svojo datoteko index.html:

sudo nano index.html

Ne pozabite uporabiti sudo, imenika www in html sta last root, zato morate za ustvarjanje, urejanje in upravljanje vseh datotek, ki živijo v teh imenikih, delovati kot root.

Osnovna stran HTML

HTML je jezik, ki sega globoko. Z njim lahko veliko narediš. Če vas zanima več, si oglejte spletno stran W3Schools, kjer najdete številne vaje o tem, kako uporabiti HTML za izdelavo spletnega mesta. Začeli bomo s preprosto stranjo HTML.

Najprej brskalniku povejte, katero različico HTML -ja uporabljate. Ta dokument je deklariran kot dokument HTML5:

Začnite z oznakami html in body:

Večji del vaše vsebine je naslednji, med oznakami telesa. Naj bo prva vrstica naslov z oznako h1. Številka za "h" določa pomembnost naslova, ki vpliva na velikost pisave. Za oznako odstavka uporabite oznako p:

Moj Raspberry Pi ima spletno stran

Kaj naj dam tukaj?

Dokončajte stran tako, da zaprete telo in html ter oznake:

Shranite dokument s pripono.html in v brskalniku obiščite localhost. Videli boste svojo spletno stran!

Kaj morate dati na spletno stran? Postavimo sliko ali še bolje animateMe.gif! Če želite, da se katero koli sredstvo prikaže na tej spletni strani, ga morate vnesti v korenski dokument dokumenta Apache. Morate ga kopirati in prilepiti, da ostane tudi v vašem imeniku boof/fotos. Če želite kopirati in prilepiti datoteko v ukazno vrstico, uporabite ukaz cp. Najprej cd v domači imenik:

cd ~

Kopirajte in prilepite datoteko animateMe.gif:

sudo cp boof/fotos/animateMe.gif/var/www/html

Vrnite se v imenik html:

cd/var/www/html

Znova odprite datoteko index.html, da lahko dodate sliko:

sudo nano index.html

Za definiranje in vdelavo slike na stran HTML uporabite oznako img. Med naslov in odstavek postavite naslednjo vrstico.

Odprite stran v brskalniku in videti bo tako, razen z lastnim elegantnim-g.webp

5. korak: Dodajte nekaj sloga

Stran je videti nekoliko neumna. Brez barve in brez sloga. Tu pride CSS. To je jezik, ki deluje roko v roki s HTML-jem, da naredi spletno stran bolj privlačno in vizualno ustvarjalno. Dotaknili se boste le tukaj, če pa želite izvedeti več, preberite več o šolah W3.

Na primer, spremenimo barvo ozadja z dodajanjem CSS v datoteko HTML. Spletno stran CSS lahko oblikujete na več načinov. Za ta razred boste uporabili slogovne oznake za vdelavo CSS -ja neposredno v datoteko HTML.

Med prve oznake HTML in body na vrhu strani HTML vnesite naslednje vrstice:

body {background-color: powderblue;} oznake. Izgledalo bo tako:

telo {ozadje-barve: praškasto modro;}

6. korak: Namestite PHP

Namesto statične strani lahko naredite dinamično, ki se lahko spreminja, ne da bi nanjo ročno naložili datoteke. Priljubljen način za to je uporaba skriptnega jezika, imenovanega PHP. Če želite uporabljati PHP na Raspberry Pi, ga morate najprej namestiti s paketom modulov za Apache:

sudo apt-get install libapache2-mod-php5 php5 -y

7. korak: Ustvarite dinamično spletno stran

Kombinirajte PHP s HTMLA, če je koda PHP v oznakah, jo lahko vključite v datotečno strukturo HTML. Na primer, združite svoje trenutne skripte HTML in PHP in povečajte besedilo z uporabo oznak HTML.

Vključimo preprost skript PHP, ki prikazuje datum in čas. Med oznake prilepite naslednje:

Shranite datoteko s kombinacijo tipk Ctrl + o, vendar spremenite razširitev iz.html v.php, kar bo shranilo novo datoteko. Da ne bi zamenjali brskalnika, odstranite staro različico.html:

sudo rm index.html

Osvežite localhost v svojem spletnem brskalniku. Izhod bo videti tako:

Ok, v čem je torej razlika? Izgleda kot običajna stran HTML, kajne? Osvežite stran in si oglejte čarobnost. Čarobnost v času se bo spremenila! To je PHP in njegova vgrajena funkcija date () vam pomaga ustvariti dinamično spletno stran.

8. korak: Ustvarite odjemalca API Tumblr

Raspberry Pi lahko prek API -ja (aplikacijskega vmesnika za programiranje aplikacij) zahteva in pridobi informacije od drugih aplikacij programske opreme na spletu. API omogoča, da nekaj, kot je Raspberry Pi, preprosto prereže vse podatke spletnega mesta in pobere le uporabne stvari. Naj se vaš Raspberry Pi pogovarja s Tumblrom, Twitterjem in weather.com, da tvitne, objavi slike in prikaže vremenske napovedi.

Raspberry Pi in Tumblr

Naslednja vaja ustvari pogovor med vašim Raspberry Pi in Tumblr. Kot odjemalec bo vaš Raspberry Pi od Tumblrja zahteval delčke podatkov, da bo lahko naložil slike na oddaljeni strežnik Tumblr, zaradi česar bodo slike objavljene v računu Tumblr. Če želite, da Raspberry Pi deluje z API -jem, bo najverjetneje že obstajala knjižnica, ki jo boste lahko uporabljali. Za Tumblr obstaja Pytumblr. Odjemalec je ustvarjen v programu Python z uporabo vgrajene funkcije, ustvarjene v Pytumblr. Ta funkcija uporablja štiri avtorizacijske kode, ki jih ustvari Tumblr:

• potrošniški ključ
• potrošniška skrivnost
• žetonski ključ
• žetonska skrivnost

Preden lahko uporabite Tumblr's API, morate dobiti štiri te ključe (podobno kot gesla). Če jih želite dobiti, sledite tem korakom:

1. Ustvarite brezplačen račun Tumblr in se prijavite.
2. Registrirajte prijavo. Podati morate le osnovne podatke, na primer naslov (poskusite "My Raspberry Pi"), opis, e -pošto in spletno mesto (uporabite tega, če ga nimate). Po registraciji boste dobili potrošniški ključ in potrošniško skrivnost. Kopirajte in prilepite na varno mesto, na primer besedilno datoteko ali e -poštno sporočilo. Če želite znova dostopati do njih, pojdite na stran računa Tumblr, v meniju Račun izberite Nastavitve in kliknite Aplikacije.
3. Prijavite se v konzolo za razvijalce s svojimi ključnimi in tajnimi kodami za pooblastitev. Ko vas vpraša, ali želite, da se objavi v vašem imenu, kliknite Dovoli.
4. Ko se prijavite v konzolo za razvijalce, boste videli vzorčno kodo v več različnih jezikih. Kliknite jeziček Python in kopirajte blok OAuth ali pa v zgornjem meniju kliknite Pokaži ključe, če si želite ogledati ključ žetona in skrivne kode žetonov skupaj z dvema kodama, ki jih že imate.

Naj te kode delujejo in naredimo program Python, ki objavi animateMe-g.webp

Najprej namestite Pytumblr:

sudo apt-get posodobitev

sudo pip namestite pytumblr

Iz domačega imenika, cd v mapo boof in ustvarite datoteko Python:

cd odbojnik

Ustvarite datoteko z urejevalnikom IDLE, da boste olajšali izrezovanje in lepljenje zelo dolgih kod za pooblastitev. To vnesite v datoteko testPytumblr.py in posodobite štiri ključe in svoje uporabniško ime:

uvoz pytumblr

# Preverja pristnost prek OAuth, kopirajte iz https://api.tumblr.com/console/calls/user/info client = pytumblr. TumblrRestClient ('your_consumer_key', 'your_consumer_secret', 'your_token', 'your_token_secret') client.create 'your_account_username', state = "published", tags = [“raspberrypi”, “picamera”], data = “fotos/animateMe.gif") tiskanje ("naloženo")

Program za vas označeno fotografijo označi z "raspberrypi" in "picamera". Če želite, lahko te oznake odstranite, zamenjate ali dodate. Ti so shranjeni v spremenljivki, imenovani tags, ki se uporablja v client.create_photo ().

Pritisnite F5 za zagon programa. Prišlo bo do napake … vendar ste Pytumblr že namestili, zakaj Python pravi, da ne najde modula? To je zato, ker Pytumblr ne podpira Pythona 3, deluje le v Pythonu 2*. Odprite urejevalnik Python 2 IDLE in izrežite in prilepite kodo, prepišite program Python 3 in ga nato zaženite. Ko je naložen GIF, bo "naložen" natisnjen v oknu lupine Python.

To je razburljiv del! Pojdite na svojo stran Tumblr in si oglejte GIF! Če želite namesto tega ustvariti osnutke objav, zamenjajte "objavljeno" v programu.

*Po objavi tega razreda je drug uporabnik githuba razcepil izvirnik in dodal podporo za Python 3 za nekatere ukaze.

Če se objava ne prikaže, dvakrat preverite, ali ste pravilno vnesli štiri ključe in uporabniško ime Tumblr ter ali je internetna povezava vašega Pi aktivna. Skript lahko zaženete tudi iz ukazne vrstice z uporabo Pythona 2 (cd v mapo boof, če še niste tam):

python testPytumblr.py

9. korak: Posnemite posnetek zaslona Tumblr in/ali spletnega mesta

Ustvarite spletno mesto za prikaz-g.webp