تاریخ جدید

ساخت وب سرور با پایتون و فلاسک

توسط Ajay Krishnan Prabhakaran9m2025/01/02

FA-AF

FA-AF

خیلی طولانی؛ خواندن

این مقاله شما را در ساخت یک وب سرور ساده با استفاده از پایتون و چارچوب Flask راهنمایی می کند. مفاهیم کلیدی مانند مسیریابی، الگوسازی، و رسیدگی به درخواست‌های HTTP را یاد خواهید گرفت، همگی در حین ایجاد یک برنامه کاربردی وب

featured image - ساخت وب سرور با پایتون و فلاسک

عصر دیجیتال نیازمند تجارب وب پویا و تعاملی است. ساخت یک وب سرور سنگ بنای این چشم انداز دیجیتالی است که به شما امکان می دهد برنامه هایی ایجاد کنید که فراتر از صفحات HTML ایستا هستند. پایتون، با نحو زیبا و کتابخانه های گسترده، پایه ای قدرتمند برای توسعه وب فراهم می کند. فلاسک، یک میکروفریمورک سبک و همه کاره، این فرآیند را بیشتر ساده می کند. با ترکیب انعطاف پذیری Python با رویکرد ساده Flask، توسعه دهندگان می توانند به سرعت و کارآمد وب سرورهای قوی بسازند. این سفر به مفاهیم اصلی توسعه وب، از رسیدگی به درخواست‌ها و پاسخ‌های HTTP گرفته تا مسیریابی و قالب‌بندی می‌پردازد، و شما را قادر می‌سازد تا برنامه‌های کاربردی وب جذاب و کاربردی بسازید که می‌توانند به دنیا متصل شوند و به آنها اطلاع دهند.

وب در حال تبدیل شدن به میدان شهر برای دهکده جهانی فردا است. - بیل گیتس

پیش نیازها

پایتون 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 کلاس اصلی برنامه ما است، render_template برای رندر قالب های HTML و درخواست برای رسیدگی به داده های فرم ورودی استفاده می شود.
ایجاد برنامه Flask : ما یک نمونه از کلاس Flask ایجاد می کنیم که برنامه WSGI (رابط دروازه وب سرور) ما خواهد بود.
تعریف مسیرها :
- 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>

Result.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 گرفته تا ارائه محتوای پویا، و ایجاد یک پایه محکم برای تلاش‌های آینده پرداخته‌ایم. وب منظره ای است که دائماً در حال تحول است و مملو از فرصت هایی برای نوآوری و خلاقیت است. این چالش را در آغوش بگیرید، به کاوش در امکانات گسترده توسعه وب ادامه دهید، و به توسعه همیشه در حال رشد اینترنت کمک کنید.