Отправить сообщение с помощью xhr - PullRequest
Новая
       12

Отправить сообщение с помощью xhr

0 голосов
/ 30 июня 2018

У меня очень простой API, созданный в node.js для получения опубликованных данных. Я отправляю данные формы с помощью xhr (xml http request) из javascript. (Jquery не используется), но я не могу получить данные формы на стороне сервера. Пожалуйста, помогите мне решить эту проблему. Ниже приведен код.

Код внешнего интерфейса: 

   <form> 
        <input type="email" class="form-control" id="email" 
         placeholder="Enter email" name="email" 

        <input type="password" class="form-control" id="password" 
         placeholder="Enter password" name="password" required="">

        <input type="file" class="form-control" id="userfile" name="userfile" 
         required="">

    <button type="submit" class="btn btn-default" id="submit">Submit</button>
  </form>

  <script>
    document.getElementById('submit').addEventListener('click',function(){

        var email=document.getElementById('email').value;
        var password=document.getElementById('password').value;
        var fileInputElement = document.getElementById('userfile');

        var formData = new FormData();

        formData.append("email", email);
        formData.append("password", password);
        formData.append("userfile", fileInputElement.files[0]);

        var xhr = new XMLHttpRequest();
        xhr.open("POST", "http://localhost:3000/form_submit");
        xhttp.setRequestHeader("Content-type", "application/x-www-form- 
        urlencoded");
        xhr.send(formData); 
    })
  </script>

Код сервера (код API узла js): 

var express = require('express');

var app = express();

app.get('/',(req,res)=>{
  console.log('you are welcome');
}) 
app.post('form_submit',function(req,res){
  console.log('entered in post request');
  console.log(req.body);
})

app.listen(3000,()=>{
  console.log('connected to 3000 port');
})

1 Ответ

0 голосов
/ 30 июня 2018

Чтобы Express мог обрабатывать данные формы, вам нужно использовать модуль bodyParser:

Используйте промежуточное ПО bodyParser.urlencoded () как: 

const bodyParser = require('body-parser');
app.use(bodyParser.urlencoded({ extended: true }));
//Now you can get the form values will be on req.body:

app.post('form_submit',function(req,res){
  console.log('entered in post request');
  console.log(req.body);
})

К вашему сведению: Обратите внимание, что анализатор тела не обрабатывает составные тела, поэтому в этом случае вы можете использовать такой модуль, как multer

Multer - это промежуточное программное обеспечение node.js для обработки multipart / form-data, которое в основном используется для загрузки файлов.

Например, чтобы получить (обычные) поля запроса: 

let multer = require('multer');
let upload = multer();
 app.post('form_submit', upload.fields([]), (req, res) => {
      let formData = req.body;
      console.log('form data', formData);
 });
...