सामग्री परोसना

स्थैतिक फ़ाइलें परोसें, HTML फ़ॉर्म संभालें, और multer के साथ सरल अपलोड स्वीकार करें।

9 मिनट · 3 प्रश्न

एक API केवल JSON नहीं लौटाती। HTML पेज, इमेज, स्टाइलशीट, एक फ्रंट-एंड बिल्ड: Express यह सब एक ही मिडलवेयर, express.static, के साथ परोसता है। फ़ोल्डर की हर फ़ाइल मिलती-जुलती URL पर सुलभ हो जाती है: public/logo.png /logo.png पर प्रतिक्रिया देती है।

import express from "express";

const app = express();

app.use(express.static("public"));

app.listen(3000, () => {
  console.log("http://localhost:3000");
});

आइए फ़ॉर्म की ओर बढ़ें। एक क्लासिक HTML फ़ॉर्म अपने फ़ील्ड application/x-www-form-urlencoded प्रारूप में भेजता है। express.urlencoded मिडलवेयर उन्हें डिकोड करता है और req.body भर देता है, ठीक वैसे ही जैसे express.json JSON के लिए करता है। public/ में एक पेज रखें जिसमें method को POST और action को /contact पर सेट किया गया फ़ॉर्म हो, फिर सबमिशन को संभालें:

app.use(express.urlencoded({ extended: true }));

app.post("/contact", (req, res) => {
  const { name, message } = req.body;
  if (!name || !message) {
    return res.status(400).send("Required fields");
  }
  res.send("Thank you " + name + ", message received.");
});

किसी फ़ाइल को भेजने के लिए, फ़ॉर्म को enctype को multipart/form-data वैल्यू के साथ घोषित करना होगा और उसमें file टाइप का एक input फ़ील्ड होना चाहिए, जिसका नाम उदाहरण के लिए avatar हो। Express इस प्रारूप को अपने आप डिकोड नहीं कर सकता: संदर्भ मिडलवेयर multer है।

npm install multer

import multer from "multer";

const upload = multer({
  dest: "uploads/",
  limits: { fileSize: 2 * 1024 * 1024 }
});

app.post(
  "/avatar",
  upload.single("avatar"),
  (req, res) => {
    if (!req.file) {
      return res.status(400).json({
        error: "No file received"
      });
    }
    res.status(201).json({
      name: req.file.filename,
      size: req.file.size
    });
  }
);

ज्ञान जांच

सुनिश्चित करें कि आपको इस पाठ के मुख्य बिंदु याद हैं।

1. public फ़ोल्डर पर लागू होने पर express.static क्या करता है?
   • यह फ़ोल्डर की हर फ़ाइल को मिलती-जुलती URL पर परोसता है
   • यह शुरुआत में फ़ोल्डर की फ़ाइलों को कंपाइल करता है
   • यह फ़ोल्डर को पासवर्ड से सुरक्षित करता है
2. कौन सा मिडलवेयर किसी क्लासिक HTML फ़ॉर्म के लिए req.body भरता है?
   • express.json()
   • express.urlencoded()
   • express.static()
3. फ़ाइल भेजने के लिए फ़ॉर्म में कौन सा एट्रिब्यूट होना चाहिए?
   • method को GET पर सेट किया गया
   • enctype को multipart/form-data पर सेट किया गया
   • target को _blank पर सेट किया गया