Innholdsfortegnelse:
- Trinn 1: Klient og server
- Trinn 2: Opprett en lokal webserver
- Trinn 3: Installer Apache
- Trinn 4: Lag en statisk webside
- Min Raspberry Pi har et nettsted
- Trinn 5: Legg til litt stil
- Trinn 6: Installer PHP
- Trinn 7: Lag en dynamisk webside
- Trinn 8: Opprett en Tumblr API -klient
- Trinn 9: Ta et skjermbilde av Tumblr og/eller nettsted
2025 Forfatter: John Day | [email protected]. Sist endret: 2025-01-13 06:58
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.
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:
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
Du kan også finne den på skrivebordet hvis du holder markøren over WiFi -mottakelsessymbolet.
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!
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.
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:
body {background-color: powderblue;}
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:
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:
- Opprett en gratis Tumblr -konto og logg inn.
- 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.
- 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.
- 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.
*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