Web Server Examples — ویب سرور

Three complete, runnable web server programs showing REST APIs, HTML web apps, and real-time WebSocket communication.

اردو: تین مکمل اور چلنے والے ویب سرور پروگرام جو REST APIs، HTML ویب ایپلیکیشنیں، اور حقیقی وقت WebSocket مواصلت ظاہر کرتے ہیں۔

---

Table of Contents

1. FastAPI — Todo REST API
2. FastAPI — HTML Web App
3. WebSocket Chat Server

---

FastAPI — Todo REST API

A complete CRUD REST API for a todo list. Demonstrates routes, JSON bodies, path parameters, status codes, and middleware.

اردو: ٹوڈو فہرست کے لیے ایک مکمل CRUD REST API۔ یہ مثال راستے، JSON جسم، راستے کے پیرامیٹر، حالت کوڈ، اور مڈل ویئر ظاہر کرتی ہے۔

درآمد { فاسٹ_اے_پی_آئی, راؤٹر, جیسن_جواب, جالی_خطا } سے "اردو/ویب"
درآمد { لاگر } سے "اردو/لاگ"

// ═══════════════════════════════════════════════════
// Todo REST API — مکمل CRUD
// بندرگاہ: 8000
// ═══════════════════════════════════════════════════

متغیر سرور = نیا فاسٹ_اے_پی_آئی({ عنوان: "Todo API", نسخہ: "1.0" })
متغیر لاگ   = نیا لاگر("todo-api")

سرور.کورس(اصل=["*"])

// ── ان میموری ڈیٹا اسٹور ─────────────────────────
متغیر todos     = {}
متغیر اگلی_id = 1

// ── مددگار فنکشن ──────────────────────────────────
فنکشن todo_ڈھونڈو(id) {
    اگر (!(id میں_ہے todos)) {
        پھینکو نیا جالی_خطا(404, `Todo ${id} نہیں ملا`)
    }
    واپس todos[id]
}

// ══════════════════════════════════════════
// GET /todos — تمام todos
// ══════════════════════════════════════════
@سرور.حاصل("/todos")
فنکشن سب_todos_دیکھیں() {
    متغیر فہرست = Object.اقدار(todos)
    لاگ.ڈیبگ(`${فہرست.length} todos واپس کر رہے ہیں`)
    واپس { تعداد: فہرست.length, todos: فہرست }
}

// ══════════════════════════════════════════
// GET /todos/{id} — ایک todo
// ══════════════════════════════════════════
@سرور.حاصل("/todos/{id}")
فنکشن ایک_todo(id) {
    واپس todo_ڈھونڈو(عدد(id))
}

// ══════════════════════════════════════════
// POST /todos — نئی todo
// ══════════════════════════════════════════
@سرور.بھیجیں("/todos")
غیر_متزامن فنکشن نئی_todo(درخواست) {
    متغیر جسم = انتظار درخواست.json()

    اگر (!جسم["عنوان"] || جسم["عنوان"].trim() == "") {
        پھینکو نیا جالی_خطا(400, "عنوان ضروری ہے")
    }

    متغیر id = اگلی_id
    اگلی_id += 1

    todos[id] = {
        id,
        عنوان:   جسم["عنوان"].trim(),
        تفصیل:   جسم["تفصیل"] یا "",
        مکمل:    جھوٹ,
        بنائی:   نیا Date().toISOString()
    }

    لاگ.معلومات(`نئی todo بنائی ID=${id}: ${todos[id].عنوان}`)
    واپس نیا جیسن_جواب(todos[id], 201)
}

// ══════════════════════════════════════════
// PUT /todos/{id} — todo تازہ کریں
// ══════════════════════════════════════════
@سرور.تازہ_کریں("/todos/{id}")
غیر_متزامن فنکشن todo_تازہ_کریں(id, درخواست) {
    متغیر todo = todo_ڈھونڈو(عدد(id))
    متغیر جسم = انتظار درخواست.json()

    todos[عدد(id)] = {
        ...todo,
        عنوان:  جسم["عنوان"] یا todo.عنوان,
        تفصیل: جسم["تفصیل"] یا todo.تفصیل,
        مکمل:  جسم["مکمل"]  ?? todo.مکمل
    }

    واپس todos[عدد(id)]
}

// ══════════════════════════════════════════
// DELETE /todos/{id} — todo مٹائیں
// ══════════════════════════════════════════
@سرور.حذف("/todos/{id}")
فنکشن todo_مٹائیں(id) {
    todo_ڈھونڈو(عدد(id))   // نہ ملنے پر 404
    حذف todos[عدد(id)]
    لاگ.معلومات(`Todo ${id} مٹا دیا`)
    واپس { پیغام: `Todo ${id} مٹا دیا گیا` }
}

// ══════════════════════════════════════════
// POST /todos/{id}/مکمل — مکمل toggle
// ══════════════════════════════════════════
@سرور.بھیجیں("/todos/{id}/مکمل")
فنکشن todo_toggle(id) {
    متغیر todo = todo_ڈھونڈو(عدد(id))
    todo.مکمل = !todo.مکمل
    واپس { id: عدد(id), مکمل: todo.مکمل }
}

// ══════════════════════════════════════════
// GET /stats — اعداد و شمار
// ══════════════════════════════════════════
@سرور.حاصل("/stats")
فنکشن اعداد_و_شمار() {
    متغیر فہرست = Object.اقدار(todos)
    واپس {
        کل:       فہرست.length,
        مکمل:     فہرست.filter(t => t.مکمل).length,
        نامکمل:   فہرست.filter(t => !t.مکمل).length
    }
}

// ─── سرور چلائیں ──────────────────────────────────
لاگ.معلومات("Todo API شروع ہو رہی ہے...")
سرور.چلائیں({ میزبان: "0.0.0.0", پورٹ: 8000 })

Test the API:

اردو: API کی جانچ کریں — درج ذیل HTTP درخواستیں سرور سے جواب حاصل کرنے کے لیے بھیجیں۔

GET http://localhost:8000/todos

POST http://localhost:8000/todos
{"عنوان": "اردو سیکھنا", "تفصیل": "روزانہ ایک گھنٹہ"}

POST http://localhost:8000/todos/1/مکمل

DELETE http://localhost:8000/todos/1

---

FastAPI — HTML Web App

A web app that returns an HTML page for a student grade book.

اردو: ایک ویب ایپ جو طلباء کے نتیجہ نامے کے لیے HTML صفحات واپس کرتی ہے۔

درآمد { فاسٹ_اے_پی_آئی, جیسن_جواب, ایچ_ٹی_ایم_ایل_جواب, جالی_خطا } سے "اردو/ویب"

// ═══════════════════════════════════════════════════
// طلباء کا نتیجہ نامہ — HTML ویب ایپ
// ═══════════════════════════════════════════════════

متغیر ایپ = نیا فاسٹ_اے_پی_آئی({ عنوان: "نتیجہ نامہ" })

متغیر طلباء = [
    { id: 1, نام: "احمد علی",   نمبر: 85, گریڈ: "B" },
    { id: 2, نام: "فاطمہ بی بی", نمبر: 92, گریڈ: "A" },
    { id: 3, نام: "علی احمد",   نمبر: 78, گریڈ: "C" }
]
متغیر اگلی_id = 4

فنکشن گریڈ_حاصل_کرو(نمبر) {
    اگر (نمبر >= 90) { واپس "A" }
    ورنہ_اگر (نمبر >= 80) { واپس "B" }
    ورنہ_اگر (نمبر >= 70) { واپس "C" }
    ورنہ_اگر (نمبر >= 60) { واپس "D" }
    ورنہ { واپس "F" }
}

// ══════════════════════════════════════════
// GET / — مرکزی صفحہ
// ══════════════════════════════════════════
@ایپ.حاصل("/")
فنکشن مرکزی() {
    متغیر قطاریں = طلباء.map(ط =>
        `<tr><td>${ط.id}</td><td>${ط.نام}</td><td>${ط.نمبر}</td><td>${ط.گریڈ}</td></tr>`
    ).join("")

    متغیر html = `<!DOCTYPE html>
<html dir="rtl" lang="ur">
<head><meta charset="UTF-8"><title>نتیجہ نامہ</title></head>
<body>
<h1>طلباء نتیجہ نامہ</h1>
<table border="1">
<tr><th>ID</th><th>نام</th><th>نمبر</th><th>گریڈ</th></tr>
${قطاریں}
</table>
</body></html>`

    واپس نیا ایچ_ٹی_ایم_ایل_جواب(html)
}

// ══════════════════════════════════════════
// GET /طلباء — JSON فہرست
// ══════════════════════════════════════════
@ایپ.حاصل("/طلباء")
فنکشن طلباء_فہرست() {
    واپس طلباء
}

// ══════════════════════════════════════════
// POST /طالب_علم — نئے طالب علم کا اضافہ
// ══════════════════════════════════════════
@ایپ.بھیجیں("/طالب_علم")
غیر_متزامن فنکشن طالب_شامل(درخواست) {
    متغیر ڈیٹا = انتظار درخواست.json()
    متغیر نام  = ڈیٹا["نام"] یا ""
    متغیر نمبر = عدد(ڈیٹا["نمبر"] یا 0)

    اگر (!نام) {
        پھینکو نیا جالی_خطا(400, "نام ضروری ہے")
    }

    متغیر نیا_طالب = {
        id:    اگلی_id,
        نام,
        نمبر,
        گریڈ:  گریڈ_حاصل_کرو(نمبر)
    }
    طلباء.شامل(نیا_طالب)
    اگلی_id += 1

    واپس نیا جیسن_جواب(نیا_طالب, 201)
}

// ══════════════════════════════════════════
// DELETE /طالب_علم/{id} — طالب علم حذف
// ══════════════════════════════════════════
@ایپ.حذف("/طالب_علم/{id}")
فنکشن طالب_حذف(id) {
    متغیر پہلے = طلباء.length
    متغیر نئی_فہرست = طلباء.filter(ط => ط.id != عدد(id))
    اگر (نئی_فہرست.length == پہلے) {
        پھینکو نیا جالی_خطا(404, `طالب علم ${id} نہیں ملا`)
    }
    طلباء.length = 0
    کے_لیے (متغیر ط کا نئی_فہرست) {
        طلباء.شامل(ط)
    }
    واپس { پیغام: `طالب علم ${id} حذف کیا گیا` }
}

// ─── چلائیں ───────────────────────────────────────
ایپ.چلائیں({ بندرگاہ: 5000 })

Visit http://localhost:5000 to see the grade book.

اردو: نتیجہ نامہ دیکھنے کے لیے اپنے براؤزر میں http://localhost:5000 پر جائیں۔

---

WebSocket Chat Server

A real-time chat server where multiple browser clients can send and receive messages instantly.

اردو: ایک حقیقی وقت گپ شپ سرور جہاں متعدد براؤزر کلائنٹ فوری طور پر پیغامات بھیج اور وصول کر سکتے ہیں۔

درآمد { فاسٹ_اے_پی_آئی, ایچ_ٹی_ایم_ایل_جواب } سے "اردو/ویب"
درآمد { لاگر } سے "اردو/لاگ"

// ═══════════════════════════════════════════════════
// حقیقی وقت گپ شپ — WebSocket
// بندرگاہ: 8080
// ═══════════════════════════════════════════════════

متغیر سرور = نیا فاسٹ_اے_پی_آئی({ عنوان: "گپ شپ سرور" })
متغیر لاگ   = نیا لاگر("گپ-شپ")

// منسلک کلائنٹس کی فہرست
متغیر کلائنٹس = []

// ══════════════════════════════════════════
// GET / — چیٹ UI
// ══════════════════════════════════════════
@سرور.حاصل("/")
فنکشن چیٹ_صفحہ() {
    متغیر html = `<!DOCTYPE html>
<html dir="rtl" lang="ur">
<head>
    <meta charset="UTF-8">
    <title>اردو گپ شپ</title>
</head>
<body>
    <h2>اردو گپ شپ</h2>
    <div id="پیغامات" style="height:300px;overflow-y:auto;border:1px solid #ccc;padding:8px"></div>
    <input id="نام" placeholder="آپ کا نام" value="گمنام">
    <input id="متن" placeholder="پیغام لکھیں..." style="width:300px">
    <button onclick="بھیجو()">بھیجیں</button>
    <script>
        const ws = new WebSocket("ws://localhost:8080/ws/")
        ws.onmessage = e => {
            const d = document.getElementById("پیغامات")
            d.innerHTML += "<p>" + e.data + "</p>"
            d.scrollTop = d.scrollHeight
        }
        function بھیجو() {
            const نام = document.getElementById("نام").value || "گمنام"
            const متن = document.getElementById("متن").value
            if (متن) {
                ws.send(نام + ": " + متن)
                document.getElementById("متن").value = ""
            }
        }
    </script>
</body>
</html>`
    واپس نیا ایچ_ٹی_ایم_ایل_جواب(html)
}

// ══════════════════════════════════════════
// WebSocket /ws/ — حقیقی وقت چیٹ
// ══════════════════════════════════════════
@سرور.ویب_ساکٹ("/ws/")
غیر_متزامن فنکشن گپ_رابطہ(websocket) {
    انتظار websocket.accept()
    کلائنٹس.شامل(websocket)
    لاگ.معلومات(`نیا کلائنٹ جڑا — کل: ${کلائنٹس.length}`)

    کوشش {
        جبکہ (سچ) {
            متغیر پیغام = انتظار websocket.receive_text()
            لاگ.ڈیبگ(`پیغام: ${پیغام}`)

            // تمام کلائنٹس کو بھیجو
            کے_لیے (متغیر کلائنٹ کا کلائنٹس) {
                کوشش {
                    انتظار کلائنٹ.send_text(پیغام)
                } پکڑو (غ) {
                    // منقطع کلائنٹ کو نظرانداز کریں
                }
            }
        }
    } پکڑو (غ) {
        لاگ.معلومات("کلائنٹ منقطع ہو گیا")
    }

    // فہرست سے ہٹائیں
    متغیر نئی_فہرست = کلائنٹس.filter(ک => ک != websocket)
    کلائنٹس.length = 0
    کے_لیے (متغیر ک کا نئی_فہرست) {
        کلائنٹس.شامل(ک)
    }
}

// ══════════════════════════════════════════
// GET /حالت — صارفین کی تعداد
// ══════════════════════════════════════════
@سرور.حاصل("/حالت")
فنکشن حالت() {
    واپس { متصل_کلائنٹس: کلائنٹس.length }
}

// ─── چلائیں ───────────────────────────────────────
لاگ.معلومات("گپ شپ سرور شروع ہو رہا ہے...")
لاگ.معلومات("URL: http://localhost:8080")
سرور.چلائیں({ میزبان: "0.0.0.0", پورٹ: 8080 })

Usage:

اردو: استعمال کا طریقہ: سرور چلائیں، پھر دو یا زیادہ براؤزر ٹیبوں میں http://localhost:8080 کھولیں اور گپ شپ شروع کریں۔

1. Run: urdu run گپ.urdu
2. Open http://localhost:8080 in two or more browser tabs
3. Enter a name and start chatting — messages appear instantly in all tabs

---

Stopping the Server — سرور بند کرنا

⚠️ Ctrl+C does not stop these servers. uvicorn keeps running after the signal. Kill the process from another terminal:

taskkill /F /IM urdu.exe        # CMD / PowerShell
Stop-Process -Name urdu -Force  # PowerShell

اردو: Ctrl+C uvicorn سرور نہیں روکتا — اوپر دی گئی کمانڈ استعمال کریں۔

---

Previous: Hello World → | Next: Data Analysis →