Innholdsfortegnelse:

Koble din Raspberry Pi til Internett: 9 trinn
Koble din Raspberry Pi til Internett: 9 trinn

Video: Koble din Raspberry Pi til Internett: 9 trinn

Video: Koble din Raspberry Pi til Internett: 9 trinn
Video: Электрика в квартире своими руками. Финал. Переделка хрущевки от А до Я. #11 2024, Juli
Anonim
Koble din Raspberry Pi til Internett
Koble din Raspberry Pi til Internett

I denne leksjonen lærer du hvordan du oppretter en webside, samler data ved hjelp av world wide web og bruker APIer for å legge ut bilder på Tumblr og Twitter.

Trinn 1: Klient og server

I databehandling er klient-server en programvaremodell som består av to deler: en klient og en server. Begge kommuniserer over et datanettverk eller sammen på samme datamaskin. Klienten er et program eller en datamaskin med programvare som er avhengig av å sende tjenesteforespørsler til en server. Serveren er et dataprogram eller en enhet som kan godta disse forespørslene, behandle dem og returnere den forespurte informasjonen til klienten. Noen ganger er det vanskelig å finne ut hvilken som er hvilken når man arbeider med maskiner som utfører flere oppgaver samtidig. Her er noen egenskaper som hjelper deg med å skille en klient og en server fra hverandre.

Klientegenskaper:

  • Det er den første aktive
  • Sender forespørsler til serveren
  • Den forventer og mottar svar fra serveren
  • Samhandler vanligvis direkte med sluttbrukere ved å bruke et hvilket som helst brukergrensesnitt, for eksempel grafisk brukergrensesnitt

Serveregenskaper:

  • Det er i utgangspunktet passivt
  • Den lytter, klar til å svare på forespørsler sendt av klienter
  • når en forespørsel kommer, svarer han med forespurte data til klientene
  • Sluttbrukere samhandler vanligvis ikke direkte med en server, men bruker en klient.
Bilde
Bilde

Et vanlig eksempel på et klient- og serverforhold er en nettleser (klient) som ber om og mottar websidefiler som ligger på en webserver.

Trinn 2: Opprett en lokal webserver

Raspberry Pi kan bli en webserver ved å installere og kjøre et serverprogram. To populære serverprogrammer med åpen kildekode er: NGINX (uttales motor x) og Apache. I denne leksjonen vil du bruke Apache fordi det i skrivende stund er mer dokumentert. Dette gjør det enklere å søke svar på nettet mens du lærer.

Raspberry Pi vil være vert for et nettsted som alle enheter på samme nettverk kan få tilgang til. La oss komme i gang!

Trinn 3: Installer Apache

Installer apache2 -pakken. Flagget -y besvarer sikkerhetsspørsmålet før installasjonen for deg.

sudo apt -get install apache2 -y

Apache kommer med en test -HTML -fil som genererer en plassholder -webside for å teste installasjonen med. Denne test -HTML -filen kommer i Apaches rotkatalog. Som standard er Apache satt til å lete i denne katalogen etter webdokumenter for å lage innhold i en nettleser. For å ta en titt på denne testsiden og bekrefte at Apache faktisk installerte riktig, trakk du den opp i nettleseren din ved å skrive inn denne URL -adressen:

localhost/

Hvis Apache er riktig installert, vil du se Apache -testnettstedet i nettleseren:

Bilde
Bilde

Finn din Raspberry Pi's IP -adresse

Du kan bruke localhost -adressen for å få tilgang til nettsiden mens du er på Raspberry Pi. For å få tilgang til websiden fra en annen datamaskin trenger du Raspberry Pi sin IP -adresse. For å finne IP -adressetypen i LXTerminal:

ifconfig

Bilde
Bilde

Du kan også finne den på skrivebordet hvis du holder markøren over WiFi -mottakelsessymbolet.

Bilde
Bilde

Trinn 4: Lag en statisk webside

Din Raspberry Pi kan nå være vert for en webside og alt innholdet som vil bli publisert på den. Det er to grunnleggende typer nettsider: statisk og dynamisk. En statisk side har innhold som ikke endres. En dynamisk side kan vise endrede data som sensoravlesninger eller endring av tid og dato.

La oss starte med en statisk side. For å lage en må du bruke et språk som heter HTML. Når du går til en webside, er det første du ser vist sannsynligvis en index.html -side. Denne siden er standardsiden en nettleser viser hvis en annen side ikke er spesifisert. Som standard ser Apache etter filen index.html her:

/var/www/html

Dette kalles dokumentrot, og det er en skjult mappe. Det er beregnet for å holde websider. Gå dit og se deg rundt:

cd/var/www/html

ls

Du vil se standard testindeks.html -filen oppført. Hvis du vil lagre standardfilen, kan du gi den nytt navn til standardIndex.html ved å bruke kommandoen mv.

sudo mv index.html defaultIndex.html

Hvis du ikke vil lagre den, fjerner du filen med kommandoen rm:

sudo rm index.html

Nå kan du opprette og begynne å redigere din egen index.html -fil:

sudo nano index.html

Husk å bruke sudo, www- og html -katalogene eies av root, så du må fungere som root for å opprette, redigere og manipulere filer som finnes i disse katalogene.

Grunnleggende HTML -side

HTML er et språk som går dypt. Du kan gjøre mye med det. Hvis du er interessert i å finne ut mer, sjekk ut W3Schools nettsted, hvor du kan finne mange opplæringsprogrammer om hvordan du bruker HTML til å bygge et nettsted. Vi starter med en enkel HTML -side.

Fortell først nettleseren hvilken versjon av HTML du bruker. Dette dokumentet er deklarert som et HTML5 -dokument:

Start med html- og body -taggene:

Størstedelen av innholdet ditt går deretter mellom kroppskodene. Gjør den første linjen til en overskrift med h1 -taggen. Tallet etter "h" definerer viktigheten av overskriften som påvirker skriftstørrelsen. Bruk p -taggen til å definere et avsnitt:

Min Raspberry Pi har et nettsted

Hva skal jeg sette her?

Avslutt siden med å lukke brødteksten og html og tagger:

Lagre dokumentet med suffikset.html og besøk localhost i nettleseren din. Du vil se nettsiden din!

Bilde
Bilde

Hva skal du legge på nettsiden? La oss sette opp et bilde, eller enda bedre, animateMe.gif! For at en eiendel skal vises på denne nettsiden, må den legges i Apaches dokumentrot. Du bør kopiere og lime den inn slik at den forblir i boof/fotos -katalogen din også. For å kopiere og lime inn en fil på kommandolinjen, bruk kommandoen cp. Først, cd til hjemmekatalogen din:

cd ~

Kopier og lim inn animateMe-g.webp

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

Gå tilbake til html -katalogen:

cd/var/www/html

Åpne index.html -filen igjen, slik at du kan legge til bildet:

sudo nano index.html

For å definere og bygge inn et bilde på en HTML -side, bruk img -taggen. Sett følgende linje mellom overskriften og avsnittet.

Åpne siden i nettleseren, og det vil se slik ut, bortsett fra med din egen stilige selfie -GIF.

Bilde
Bilde

Trinn 5: Legg til litt stil

Siden ser litt kjedelig ut. Ingen farge og ingen stil. Det er her CSS kommer inn. Det er et språk som fungerer hånd i hånd med HTML for å gjøre en webside mer attraktiv og visuelt kreativ. Du vil bare berøre her, men hvis du vil lære mer, gå over W3schools for å lære mer.

Som et eksempel, la oss endre fargen på bakgrunnen ved å legge til CSS i HTML -filen din. Det er flere måter å style nettsiden din på med CSS. For denne klassen vil du bruke stilmerkene til å bygge CSS rett inn i HTML -filen.

Sett inn følgende linjer mellom de første html- og brødtekstene øverst på HTML -siden din:

body {background-color: powderblue;} tagger. Det vil se slik ut:

Bilde
Bilde

body {background-color: powderblue;}

Bilde
Bilde

Trinn 6: Installer PHP

I stedet for en statisk side kan du lage en dynamisk side som kan endres uten at du laster opp filer manuelt til den. En populær måte å gjøre dette på er å bruke et skriptspråk som kalles PHP. For å bruke PHP på Raspberry Pi må du først installere den med modulpakke for Apache:

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

Trinn 7: Lag en dynamisk webside

Kombiner PHP med HTMLA -er så lenge PHP -koden er inneholdt i tagger, du kan inkludere den i en HTML -filstruktur. Som et eksempel kan du kombinere gjeldende HTML- og PHP -skript og gjøre teksten større ved å bruke HTML -tagger.

La oss inkludere et enkelt PHP -skript som viser dato og klokkeslett. Lim inn følgende hvor som helst mellom taggene:

Lagre filen med Ctrl + o, men endre utvidelsen fra.html til.php, som vil lagre en ny fil. For ikke å forvirre nettleseren, fjern den gamle.html -versjonen:

sudo rm index.html

Oppdater localhost i nettleseren din. Utgangen vil se slik ut:

Bilde
Bilde

Ok, så hva er forskjellen? Det ser ut som en vanlig HTML -side ikke sant? Oppdater siden og se på magien. Det magiske er at tiden vil endre seg! Det er PHP og den innebygde datofunksjonen () som fungerer for å lage en dynamisk webside.

Trinn 8: Opprett en Tumblr API -klient

Raspberry Pi kan be om og få informasjon fra andre programvare online via et API (Application Programming Interface). Et API gjør det enkelt for noe som Raspberry Pi å skjære gjennom alle dataene på et nettsted for å få tak i bare de nyttige tingene. Få din Raspberry Pi til å snakke med Tumblr, Twitter og weather.com for å tweet, legge ut bilder og vise værmeldinger.

Bringebær Pi og Tumblr

Følgende øvelse skaper en samtale mellom din Raspberry Pi og Tumblr. Som klient vil din Raspberry Pi be Tumblr om datasnutter, slik at den kan laste opp bilder til Tumblrs eksterne server, noe som resulterer i at bildene blir lagt ut på en Tumblr -konto. For å få en Raspberry Pi til å jobbe med et API, vil det mest sannsynlig allerede være et bibliotek der ute som du kan bruke. For Tumblr er det Pytumblr. En klient opprettes i et Python-program ved hjelp av en innebygd funksjon opprettet i Pytumblr. Denne funksjonen bruker fire autorisasjonskoder generert av Tumblr:

  • forbrukernøkkel
  • forbrukerhemmelighet
  • token nøkkel
  • symbolhemmelighet

Før du kan bruke Tumblrs API må du få fire disse nøklene (ligner på passord). Følg disse trinnene for å få dem:

  1. Opprett en gratis Tumblr -konto og logg inn.
  2. Registrer en søknad. Du trenger bare å gi grunnleggende informasjon, for eksempel en tittel (prøv "My Raspberry Pi"), beskrivelse, e -post og nettsted (bruk denne hvis du ikke har en). Etter registrering får du en forbruksnøkkel og forbrukerhemmelighet. Kopier og lim dem inn på et trygt sted, for eksempel en tekstfil eller e -post. For å få tilgang til dem igjen, gå til Tumblr -kontosiden din, velg Innstillinger i Konto -menyen og klikk på Apper.
  3. Logg deg på utviklerkonsollen ved hjelp av nøkkelen og de hemmelige autorisasjonskodene. Klikk på Tillat når du blir spurt om du vil at den skal legges ut på dine vegne.
  4. Når du er logget på utviklerkonsollen, vil du se eksempelkode på flere forskjellige språk. Klikk enten på Python -fanen og kopier OAuth -blokken, eller klikk på Vis nøkler i toppmenyen for å se tokenøkkelen og tokenhemmelige koder sammen med de to kodene du allerede har.

La oss få disse kodene til å fungere og lage et Python -program som legger animateMe-g.webp

Installer først Pytumblr:

sudo apt-get oppdatering

sudo pip installer pytumblr

Fra hjemmekatalogen, cd inn i boof -mappen og opprett en Python -fil:

cd boof

Lag filen din ved hjelp av IDLEs editor for å gjøre det enklere å klippe og lime inn dine veldig lange autorisasjonskoder. Legg dette i din testPytumblr.py -fil, oppdater de fire nøklene og brukernavnet ditt:

import pytumblr

# Autentiserer via OAuth, kopier fra https://api.tumblr.com/console/calls/user/info client = pytumblr. TumblrRestClient ('your_consumer_key', 'your_consumer_secret', 'your_token', 'your_token_secret') klienten.create_photo ('ditt_konto_brukernavn', state = "publisert", tags = ["raspberrypi", "picamera"], data = "fotos/animateMe.gif") print ("lastet opp")

Programmet merker det opplastede bildet for deg med "raspberrypi" og "picamera". Hvis du ønsker det, kan du fjerne, erstatte eller legge til disse kodene. Disse er lagret i en variabel som kalles koder som brukes i client.create_photo ().

Trykk på F5 for å kjøre programmet. Det vil være en feil … men du har allerede installert Pytumblr, så hvorfor sier Python at den ikke finner modulen? Dette er fordi Pytumblr ikke støtter Python 3, det fungerer bare i Python 2*. Åpne Python 2 IDLE -editoren og klipp ut og lim inn koden, skriv over Python 3 -programmet og kjør det. Når den har lastet opp GIF, blir "lastet opp" skrevet ut i Python -skallvinduet.

Dette er den spennende delen! Gå til Tumblr -siden din og sjekk GIF! Bytt "publisert" i programmet til "utkast" hvis du vil lage utkast til innlegg i stedet.

Bilde
Bilde

*Etter at denne klassen ble publisert, har en annen github -bruker punget originalen og lagt til støtte for Python 3 for visse kommandoer.

Hvis innlegget ikke vises, må du dobbeltsjekke at du har angitt de fire tastene og Tumblr -brukernavnet ditt riktig, og at Pi -internettforbindelsen er aktiv. Du kan også kjøre skriptet ditt fra kommandolinjen ved å bruke Python 2 (cd til mappen din hvis du ikke allerede er der):

python testPytumblr.py

Trinn 9: Ta et skjermbilde av Tumblr og/eller nettsted

Lag et nettsted for å vise en-g.webp

Anbefalt: