在 Node.js 中使用 Express.js 处理表单

在本文中，我们将在 NodeJS 中使用 ExpressJS 处理表单。

使用 Node.js 中的服务器端编程，我们可以创建表单，我们可以在其中放置某些参数，这些参数在填写时会存储在数据库中。

设置环境：

您可以参考此网站下载 Node.js。除此之外，我们还必须记住，我们正在处理涉及数据存储的事情。为此，我们需要可以存储从用户端提交的信息的东西。

我们将使用 MongoDB 存储从表单提交的数据。在继续之前，我们应该在我们的设备中预安装 MongoDB。

您可以参考此网站下载 MongoDB。

下载 MongoDB 后，在进行上述实现之前，我们必须遵循一些步骤：

Run "mongod" command at first.
Press 'ctrl+c' and write 'echo "mongod --nojournal" > mongod'
Write 'chmod a+x mongod'

现在，设置 npm 包：

npm init -y

安装依赖：

在终端中使用以下命令一次安装软件包：

npm install express body-parser mongoose ejs --save

文件夹结构：

现在让我们转到代码部分。

App.js

//importing dependencies
const express = require("express")
const app=express();
var mongoose=require("mongoose");
var bodyParser=require("body-parser");
  
// Calling form.js from models
var Form=require("./models/form");
  
// Connecting to database
mongoose.connect("mongodb://localhost/form",{
    useNewUrlParser: true,
    useUnifiedTopology: true
});
  
//middlewares
app.set('view engine','ejs');
app.use(bodyParser.urlencoded({extended:true}));
  
//rendering form.ejs
app.get("/",function(req,res){
    res.render("form");
});
  
// form submission
app.get('/result',(req,res)=>{
    res.render('result');
});
  
//creating form
app.post("/",function(req,res){
    var username=req.body.username;
    var email=req.body.email;
    var f={username: username,email:email};
    Form.create(f,function(err,newlyCreatedForm){
        if(err)
        {
            console.log(err);
        }else{
            res.redirect("/result");
        }
    });
});
  
// Starting the server at port 3000
app.listen(3000, function() { 
    console.log('Server running on port 3000'); 
});

表单.js

//Requiring mongoose package
var mongoose=require("mongoose");
  
// Schema
var formSchema=new mongoose.Schema({
    username : String,
    email    : String
});
  
module.exports=mongoose.model("Form",formSchema);

头文件.ejs

表单.ejs

<%- include("./partials/header") %>


    
    Username: 
    


    
    Email: 
    


    
    Submit


<%- include("./partials/footer") %>

输出：

填写表格后：

单击提交按钮，我们被重定向到 /result 路由。

蒙哥壳：

我们可以看到表单提交的信息是存储在数据库中的。这就是表单在节点 js 中的工作方式。