Manipulando dados de entrada em Express.js

Ao criar aplicativos da Web, lidar com os dados de entrada do usuário é um aspecto crítico para criar recursos interativos e flexíveis. No Express.js ambiente de desenvolvimento, você pode facilmente processar dados de entrada de formulários e várias solicitações HTTP, como GET, POST, PUT, PATCH e DELETE. Aqui está um guia detalhado com vários métodos e exemplos para ajudá-lo a conseguir isso:

Recebendo informações de Form

Criando HTML Form: comece criando um HTML form em um arquivo Pug ou EJS. Certifique-se de definir o action atributo na <form> tag para especificar a rota para onde a solicitação será enviada.

<form action="/process" method="post">  
  <input type="text" name="username" placeholder="Username">  
  <input type="password" name="password" placeholder="Password">  
  <button type="submit">Submit</button>  
</form>  

Solicitação de tratamento POST: no manipulador de rota, utilize o body-parser middleware para extrair dados da POST solicitação.

const bodyParser = require('body-parser');  
  
app.use(bodyParser.urlencoded({ extended: true }));  
  
app.post('/process',(req, res) => {  
  const username = req.body.username;  
  const password = req.body.password;  
  // Process data and return results  
});  

 

Manipulando vários tipos de solicitação com exemplo de login

Sending POST Request from Login Form: No HTML form, certifique-se de definir o post método e o action atributo para especificar a rota para onde a POST solicitação será enviada.

<form action="/login" method="post">  
  <input type="text" name="username" placeholder="Username">  
  <input type="password" name="password" placeholder="Password">  
  <button type="submit">Login</button>  
</form>  

Tratamento de POST solicitação de login: no manipulador de rotas, use o body-parser middleware para extrair dados da POST solicitação e executar o processamento de login.

const bodyParser = require('body-parser');  
  
app.use(bodyParser.urlencoded({ extended: true }));  
  
app.post('/login',(req, res) => {  
  const username = req.body.username;  
  const password = req.body.password;  
  
  // Check login information  
  if(username === 'admin' && password === '123') {  
    res.send('Login successful!');  
  } else {  
    res.send('Login failed!');  
  }  
});  

 

Tratamento PUT e DELETE Pedidos

Solicitação de tratamento PUT: Para lidar com PUT solicitações, você pode usar uma rota e um middleware para extrair dados da solicitação e realizar a atualização correspondente.

app.put('/update/:id',(req, res) => {  
  const id = req.params.id;  
  const updatedData = req.body;  
  // Perform data update with corresponding ID  
});  

Solicitação de tratamento DELETE: Para tratar DELETE as solicitações, também use uma rota e um middleware para identificar o ID e executar a exclusão.

app.delete('/delete/:id',(req, res) => {  
  const id = req.params.id;  
  // Perform data deletion with corresponding ID  
});  

 

Conclusão

Compreender como lidar com os dados de entrada do usuário e várias solicitações HTTP é crucial no desenvolvimento da web. Ao usar Express.js um middleware como body-parser, você pode processar facilmente a entrada de formulários e lidar com diferentes solicitações HTTP, incluindo GET, POST, PUT, PATCH e DELETE. Isso permite que você crie recursos interativos e flexíveis em seu site.