前端代码如下:
<!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不对?
到底怎么解决啊?请指点!
有人吗?有人吗?有人吗?