首页 > 在hapi框架里使用ajax提交表单数据,但是服务端接收到的数据是空对象。怎么办啊?

在hapi框架里使用ajax提交表单数据,但是服务端接收到的数据是空对象。怎么办啊?

前端代码如下:

<!DOCTYPE html>
<html>
<head>
    <title>page1</title>
    <meta charset='UTF-8'/>
</head>
<body>
    <form id='form'>
        <fieldset>
            <legend>people information</legend>
            <label for="name">name</label>
            <input type="text" id="name"/>
            <label for="type">type</label>
            <input type="text" id="type"/>
            <label for="camp">camp</label>
            <input type="text" id="camp"/>
        </fieldset>
    </form>
    <button id="commit">提交</button>
    <script type="text/javascript" src="/js/transdata2.js"></script>
</body>
</html>

前端js代码如下:

var commitBtn = document.querySelector('#commit');

commitBtn.addEventListener('click',function(){
    var form = document.querySelector('#form');
    var vForm = new FormData(form);
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4 ){
            if(xhr.status == 200){
                console.log(xhr.response);
            } else {

            }
        } else {

        }
    }

    xhr.open('POST','http://localhost:3000/commit');
    xhr.send(vForm);
},false)

后台代码如下:

'use strict';
const Hapi = require('hapi');
const server = new Hapi.Server();
server.connection({port:3000});

server.start((err) => {
    if(err){
        throw(err);
    }
    console.log('Server running at:',server.info.uri);
});

server.register(require('inert'),(err) => {
    if (err){
        throw err;
    }

    server.route({
        method: 'GET',
        path: '/js/transdata2.js',
        handler:function(request,reply){
            reply.file('./js/transdata2.js');
        }
    })

    server.route({
        method:'GET',
        path:'/page1',
        handler:function(request,reply){
            reply.file('./view/page1.html');
        }
    })
})

server.route({
    method:'POST',
    path:'/commit',
    handler:function(request,reply){
        console.log(request.payload);
        return reply('ok');
    }
})

但是后端接收到的却是空对象。
是不是使用request.payload不对?
到底怎么解决啊?请指点!


有人吗?有人吗?有人吗?

【热门文章】
【热门文章】