Նոր պատմություն

Վեբ սերվերի կառուցում Python-ով և Flask-ով

կողմից Ajay Krishnan Prabhakaran9m2025/01/02

FA-AF

Չափազանց երկար; Կարդալ

Այս հոդվածը ձեզ ուղղորդում է Python-ի և Flask Framework-ի միջոցով պարզ վեբ սերվեր ստեղծելու ճանապարհին: Դուք կսովորեք հիմնական հասկացությունները, ինչպիսիք են երթուղավորումը, ձևանմուշը և HTTP հարցումների մշակումը, այս ամենը ֆունկցիոնալ վեբ հավելված ստեղծելու ընթացքում:

featured image - Վեբ սերվերի կառուցում Python-ով և Flask-ով

Թվային դարաշրջանը պահանջում է դինամիկ և ինտերակտիվ վեբ փորձառություններ: Վեբ սերվերի կառուցումը այս թվային լանդշաֆտի հիմնաքարն է, որը հնարավորություն է տալիս ստեղծել ծրագրեր, որոնք դուրս են գալիս ստատիկ HTML էջերից: Python-ն իր էլեգանտ շարահյուսությամբ և ընդարձակ գրադարաններով հզոր հիմք է ստեղծում վեբ զարգացման համար: Flask-ը՝ թեթև և բազմակողմանի միկրոշրջանակ, ավելի հեշտացնում է գործընթացը: Համատեղելով Python-ի ճկունությունը Flask-ի պարզեցված մոտեցման հետ՝ մշակողները կարող են արագ և արդյունավետ կերպով կառուցել ամուր վեբ սերվերներ: Այս ճամփորդությունը խորանում է վեբ մշակման հիմնական հասկացությունների մեջ՝ սկսած HTTP հարցումների և պատասխանների մշակումից մինչև երթուղիներ և ձևանմուշներ, թույլ տալով ձեզ ստեղծել գրավիչ և ֆունկցիոնալ վեբ հավելվածներ, որոնք կարող են կապել և տեղեկացնել աշխարհին:

«Ցանցը դառնում է վաղվա համաշխարհային գյուղի քաղաքի հրապարակը»: - Բիլ Գեյթս

Նախադրյալներ

Python 3.x
Կոլբա

Տեղադրեք Flask-ը՝ օգտագործելով pip.

 pip install flask

Օրենսգիրքը

Ստորև ներկայացված է ռեստորանի ամրագրման պարզ համակարգի ամբողջական կոդը.

 from flask import Flask, render_template, request app = Flask(__name__) @app.route('/') def index(): return render_template('index.html') @app.route('/submit', methods=['POST']) def submit(): # Extract form data name = request.form['name'] phone = request.form['phone'] email = request.form['email'] date = request.form['date'] time = request.form['time'] # Create a message for the result page message = ( f"Hello, {name.split()[0]}! Your reservation has been booked for {date} at {time}. " f"A reminder has been sent to {phone} and {email}" ) return render_template('result.html', message=message) if __name__ == '__main__': app.run(debug=True)

Flask մոդուլների ներմուծում . Մենք սկսում ենք Flask-ից անհրաժեշտ մոդուլների ներմուծմամբ: Flask-ը մեր հավելվածի հիմնական դասն է, render_template-ն օգտագործվում է HTML ձևանմուշները մատուցելու համար, իսկ հարցումը՝ մուտքային ձևի տվյալները մշակելու համար:
Flask հավելվածի ստեղծում . մենք ստեղծում ենք Flask դասի օրինակ, որը կլինի մեր WSGI (Web Server Gateway Interface) հավելվածը:
Երթուղիների սահմանում .
- Index Route ('/') . Այս երթուղին ներկայացնում է index.html ձևանմուշը, որը պետք է պարունակի օգտատերերի ամրագրման մանրամասները մուտքագրելու ձևը:
- Ներկայացնել երթուղին ('/submit') : Այս երթուղին մշակում է ձևի ներկայացումը: Այն քաղում է տվյալները ձևից՝ օգտագործելով request.form և կառուցում է հաստատման հաղորդագրություն: Հաղորդագրությունն այնուհետև փոխանցվում է result.html ձևանմուշին՝ մատուցման համար:
Հավելվածի գործարկում.

 python app.py

Վրիպազերծման ռեժիմ . Եթե ձեր app.py ներառում է app.run(debug=True) , ապա սերվերը կգործարկվի վրիպազերծման ռեժիմում, որն օգտակար է զարգացման համար: Այն տրամադրում է մանրամասն սխալի հաղորդագրություններ և ավտոմատ կերպով վերաբեռնում է սերվերը, երբ դուք փոփոխություններ եք կատարում ձեր կոդի մեջ:

Նավահանգիստ և հոսթ . Լռելյայնորեն, Flask-ն աշխատում է http://127.0.0.1:5000/ ով: Եթե Ձեզ անհրաժեշտ է փոխել հոսթը կամ նավահանգիստը, կարող եք փոփոխել app.run() զանգը ձեր app.py ում:

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

Index.html

index.html ֆայլը ծառայում է որպես ամրագրման համակարգի օգտատիրոջ միջերես, որն ունի ձև, որտեղ օգտատերերը կարող են մուտքագրել իրենց տվյալները, ինչպիսիք են անունը, հեռախոսահամարը, էլ. Այն ձևավորված է CSS-ով, որպեսզի ապահովի տեսողական գրավիչ և օգտագործողի համար հարմար փորձ: Ներկայացվելուց հետո ձևի տվյալները ուղարկվում են սերվեր՝ մշակման:

 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Restaurant Table Booking</title> <style> body { font-family: Arial, sans-serif; background-image: url('https://img.freepik.com/premium-vector/delicious-food-menu-landing-page-template-homepage-design_631465-116.jpg?w=2000'); background-size: cover; background-position: center; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; } .form-container { background-color: rgba(255, 255, 255, 0.8); padding: 40px; border-radius: 8px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); max-width: 300px; width: 100%; } h1 { text-align: center; color: #333; } label { display: block; margin-bottom: 8px; color: #555; } input[type="text"], input[type="email"], input[type="tel"], input[type="date"], input[type="time"] { width: 100%; padding: 10px; margin-bottom: 15px; border: 1px solid #ccc; border-radius: 4px; } input[type="submit"] { width: 100%; padding: 10px; background-color: #4CAF50; color: white; border: none; border-radius: 4px; cursor: pointer; font-size: 16px; } input[type="submit"]:hover { background-color: #45a049; } </style> </head> <body> <div class="form-container"> <h1>Book a Table</h1> <form action="/submit" method="POST"> <label for="name">Name:</label> <input type="text" id="name" name="name" required> <label for="phone">Phone Number:</label> <input type="tel" id="phone" name="phone" required> <label for="email">Email:</label> <input type="email" id="email" name="email" required> <label for="date">Date:</label> <input type="date" id="date" name="date" required> <label for="time">Time:</label> <input type="time" id="time" name="time" required> <input type="submit" value="Submit"> </form> </div> </body> </html>

Արդյունք.html

result.html ֆայլը օգտատիրոջը հաստատման հաղորդագրություն է ցուցադրում ձևը ներկայացնելուց հետո: Այն դինամիկ կերպով ցույց է տալիս ամրագրման մանրամասները՝ հաստատելով ամրագրումը և հավաստիացնում է, որ հիշեցում է ուղարկվել տրամադրված կոնտակտային տեղեկատվությանը

 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Reservation Confirmation</title> <link href="https://fonts.googleapis.com/css2?family=Lobster&display=swap" rel="stylesheet"> <style> body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background-image: url('https://img.freepik.com/free-vector/minimal-doodle-frame-background-social-story-highlight_53876-97970.jpg?t=st=1735447681~exp=1735451281~hmac=d8f33db86d2b336838279674afb91df8c2089c7e8be13d316dc26982e0b30ac2&w=2000'); background-size: cover; background-position: center; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; color: #fff; } .form-container { background-color: rgba(0, 0, 0, 0.7); padding: 40px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); max-width: 400px; width: 100%; text-align: center; } h1 { font-family: 'Lobster', cursive; font-size: 32px; margin-bottom: 20px; } p { font-size: 18px; line-height: 1.5; } </style> </head> <body> <div class="form-container"> <h1>Reservation Confirmed!</h1> <p>{{ message }}</p> </div> </body> </html>

Փակման մտքեր

Մենք խորացել ենք վեբ զարգացման հիմնական սկզբունքների մեջ՝ սկսած HTTP հարցումների մշակումից մինչև դինամիկ բովանդակության տրամադրում, ամուր հիմքեր դնելով ապագա ջանքերի համար: Համացանցը անընդհատ զարգացող լանդշաֆտ է, որը լի է նորարարության և ստեղծագործական հնարավորություններով: Ընդունեք այս մարտահրավերը, շարունակեք ուսումնասիրել վեբ զարգացման հսկայական հնարավորությունները և նպաստեք ինտերնետի անընդհատ աճող գոբելենին