allishappy
@allishappy

Почему ajax не обрабатывается?

Собственно, ajax отсылается так:
var form = document.querySelector('#reg');
    form.addEventListener('submit', event => {
      event.preventDefault();
      var json = JSON.stringify({
        name: "Виктор",
        surname: "Цой"
      });
      var xhr = new XMLHttpRequest();
      xhr.open('POST', '/reg', true);
      xhr.send(json);
    });


И вот так принимаю:
app.use(bodyParser.urlencoded({extended: true}));
app.post('/reg', (req, res) => {
  console.log(req.body);
});


В консоли вижу {}
При этом обычные POST-запросы (не AJAX) обрабатываются нормально. В чём проблема?
  • Вопрос задан
  • 740 просмотров
Решения вопроса 1
@void01
все что обсуждали ранее было неверно ))

решил повторить ошибку у себя и действительно при отправке через XMLHttpRequest
нода не жалает парсить реквест.

а теперь магия...
после xhr.open('POST', '/reg', true);
добавляем:
заклинание 1:
xhr.setRequestHeader("Content-Type", "application/json");

заклинание 2:
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");


весь остальной код остается как в вопросе.

P.S.
вариант 2, используем jQuery ajax, он сам правильно проставляет заголовки.

ниже код на котором я проверял, у меня все работает
<html>
	<head>
		<title>TEST</title>
		<script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>		

    </head>
    <body>
    <form id="reg">
        <input type="submit"/>
    </form>
    <div id="select_div"><a href="#" id="select_link">Send test data</a></div>    
            <script type="text/javascript">
            $(function(){               
                $('#select_link').click(function(e){
                    e.preventDefault();
                    console.log('Send test data');
                    var data = {
                        name: "Виктор",
                        surname: "Цой"
                      };


                    
                    $.ajax({
                        type: 'POST',
                        data: JSON.stringify(data),
                        contentType: 'application/json',
                        url: '/reg',                      
                        success: function(data) {
                            console.log('success');
                            console.log(JSON.stringify(data));
                        }
                    });
                });             
            });

    var form = document.querySelector('#reg');
    form.addEventListener('submit', event => {
                    console.log('Form submited');
          event.preventDefault();
          var json = JSON.stringify({
            name: "Виктор",
            surname: "Цой"
         });
        var xhr = new XMLHttpRequest();
        xhr.open('POST', '/reg');
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
       xhr.send(json);
    });

        </script>
    </body>
</html>


и апликуха
var express = require('express');
var bodyParser = require('body-parser');
var app = express();

app.use(bodyParser());
app.post('/reg', function(req, res){
	console.log('body: ' + JSON.stringify(req.body));
	res.send(req.body);
});
app.get('/', function(req, res) {
    res.sendfile('views/test.html', {root: __dirname })
});
app.listen(10240);


Package.json
{
  "name": "testapp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.14.0",
    "body-parser": "1.8"
  }
}
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@tosha_lol_daaa
f12(гугл) -> network -> /reg = данные отправляются ?
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы