Web-kehityksen Perusteet

HTML-Lomakkeiden Käsittely

Helppo
5 min

Muistatko kun aiemmin kurssilla tutustuimme HTML-lomakkeisiin jotka lähettävät (yleensä POST-muotoisia) HTTP-pyyntöjä taustajärjestelmään? Täydennetään nyt yhtälö rakentamalla myös taustajärjestelmän puoli.

Yksinkertainen esimerkki

Aloitetaan luomalla Flask-sovellus ja määrittämällä sille yksinkertainen reitti, joka palauttaa HTML-sivun, jossa on lomake:

from flask import Flask, render_template, request

app = Flask(__name__)

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

Tämä reitti palauttaa 'index.html' -nimisen mallipohjan, joka sisältää HTML-lomakkeen. Luodaan tämä pohja ja lisätään siihen lomake:

<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
	<title>Flask-lomake</title>
</head>
<body>
	<h1>Lähetä tietoja Flask-sovellukselle</h1>
	<form method="POST" action="/submit">
		<label for="nimi">Nimi:</label>
		<input type="text" id="nimi" name="nimi"><br><br>
		<label for="sukunimi">Sukunimi:</label>
		<input type="text" id="sukunimi" name="sukunimi"><br><br>
		<label for="email">Sähköposti:</label>
		<input type="email" id="email" name="email"><br><br>
		<input type="submit" value="Lähetä">
	</form>
</body>
</html>

Tämä lomake sisältää kolme kenttää: nimi, sukunimi ja sähköposti. Kun käyttäjä lähettää lomakkeen, sen tiedot lähetetään POST-pyynnöllä '/submit'-reitille. Määritellään tämä reitti Flask-sovelluksessa ja lisätään siihen koodi, joka käsittelee lomakkeen datan:

@app.route('/submit', methods=['POST'])
def submit():
    nimi = request.form['nimi']
    sukunimi = request.form['sukunimi']
    email = request.form['email']
    return f"Terve {nimi} {sukunimi}, sähköpostisi on {email}."

Harjoittele

Kokeile itse!

Valitettavasti Replit-palvelu on muuttnut lennosta eikä enää anna suorittaa näitä koodeja suoraan selaimessa. Voit klikata alla olevaa "Open in Replit" linkkiä ja avata koodin Replit-palvelussa. Meillä on työn alla etsiä Replitille korvaaja.

hakatemia pro

Valmis ryhtymään eettiseksi hakkeriksi?
Aloita jo tänään.

Hakatemian jäsenenä saat rajoittamattoman pääsyn Hakatemian moduuleihin, harjoituksiin ja työkaluihin, sekä pääset discord-kanavalle jossa voit pyytää apua sekä ohjaajilta että muilta Hakatemian jäseniltä.