Raspberrypi Flask Server

2018/06/22
tutorial
tutorial, linux, raspberrypi, flask, python, python-flask, webserver

Een van de manieren om een webserver op je raspberrypi te maken is om gebruik te maken via flask. Met flask kan je dynamische content weergeven op je site. Je kan het instaleren met

sudo apt-get install python3-flask

zodra dat gedaan is kan je een nieuwe map maken waar je je website in wilt opslaan. zodra dat gedaan is, open die map.

mkdir website
cd website

dan kan je een nieuw document openen met idle en het opslaan als ‘app.py’ in de map die je net hebt gemaakt. In dit document zul je de code schrijven die je website zal uitvoeren.

from flask import Flask

app = Flask(__name__)

@app.route('/')
def index():
    return 'Hello world'

if __name__ == '__main__':
    app.run(debug=True, host='0.0.0.0')

als je de server start met ‘python3 app.py’ zal je zien dat de server aan het starten is. Deze kan je dan bereiken op poort 5000. Als je op de raspberrypi zelf bezig bent, kan je in een browser ‘127.0.0.1:5000’ intikken. Als je het bekij Je kan ook html templates toevoegen aan je website. maak een map ‘templates’ aan. Open een tekst-editor en maak een nieuw document genaamd ‘index.html’ en sla het op in de templates map. Hier kan je eender welke html code aan toevoegen. Hier is een

link naar een codepaste met basis html in. Nu zul je in app.py wat moeten aanpassen om dit bestand weer te geven op je webserver. Voeg bovenaan ondere de andere inport regel de volgende toe:

from flask import Flask, render_template

dan zal je Ee de route moeten aanpassen:

@app.route('/')
def index():
    return render_template('index.html')

Als je nu de flask server herstart, dan zult je zien dat de tekst weergeeft die je in het html document hebt gezet. Je kan deze ook aanpassen met css. daarvoor zul je terug naar de beginmap van je website gaan en een nieuwe map aanmaken genaamd ‘static’. maak daar een nieuw bestand aan genaamd style.css en zet er volgende code in:

body {
    background: red;
    color: yellow;
}

sla dit op en open het html bestand van daarnet. als je daar een <head> tag aan toevoegd met daarin een tag dat een link geeft naar het stylesheet (/static/style.css) zul je zien dat het de kleuren gebruikt die in het css bestand staan.

Dynamishe inhoud

Doordat de webserver gebaseerd is op python, kan je natuurlijk ook dynamische inhoud weergeven, zoals een bepaalde naam als je bv naar ‘http://127.0.0.1/hello/vincent’ op je flask server gaat, je ‘hallo vincent’ ziet, en als je naar ‘/hello/persoon-y’ gaat je ‘hallo persoon-y’ ziet. dit kan je doen om een aparte route toe te voegen.

@app.route('/hello/<name>')
def hello(name):
    return render_template('page.html', name=name)

de betekent dat het de naam doorgeeft naar de functie ‘hello’ als een variabele genaamd name.
de ‘def hello(name) is de functie die bepaalt welke inhoud getoond word.
de ‘return render_template(‘page.html’, name=name is waar het de template ‘page.html’ gaat halen en er de variable naam uit de url gaat aan toevoegen zodat we het kunen gebruiken. maak daarna een nieuwe html template genaamd ‘page.html’ en sla het op in de templates map en zet er de volgende code in:

<h1>Hallo!</h1>

Sla de bestanden op en herstart de webserver. Als je nu naar ‘http://127.0.0.1/hello/vincent’ gaat, zul je zien dat er ‘Hallo Vincent’ verschijnt, en als je de naam veranderd door een andere, die persoon begroet word. Je kan flask nog voor zo veel dingen gebruiken. Dus bekijk zeker de

documentatie ervan.