Node.JS中http表单提交的方法及实现是怎样的
Admin 2022-08-16 群英技术资讯 997 次浏览
本篇内容介绍了“Node.JS中http表单提交的方法及实现是怎样的”的有关知识,在实际项目的操作过程或是学习过程中,不少人都会遇到这样的问题,接下来就让小编带大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!之前介绍了http模块的请求与响应的过程,也介绍了TCP协议的客户端与服务端的数据传输,http协议是TCP上层协议。这里创建了一个简单的web服务器,并对提交表单数据进行处理,根据了不起的Node.js一书总结。
之前也总结过,向服务器提交数据需要使用POST方法,GET方法的请求信息都在查询字符串中,没有请求体,而POST方法的传输的数据都在请求体中,故提交表单数据时需要使用POST方法。
req是请求信息,req.url表示请求的地址,当服务器运行之后,req请求的网址为127.0.0.1:3000,此时req.url为‘/’,则返回的是一串表单数据,在表单数据中设置了method是post,action是‘/url’,表面提交数据的方式是POST,将数据提交的地址为127.0.0.1:3000/url,而提交之后要获取新的页面即127.0.0.1:3000/url,此时req.url为‘/url’,故显示的另一个页面。
//提交表单数据
var http=require('http');
var querystring=require('querystring');
var server=http.createServer(function (req,res) {
//req.url不同则返回的页面不同
if('/'==req.url){
res.writeHead(200,{'Content-Type':'text/html'});
res.write([
'<form method="post" action="/url">',
'<h1>My Form</h1>',
'<fieldset>',
'<label>Personal Information</label>',
'<p>What is your name?</p>',
'<input type="text" name="name">',
'<button>submit</button>',
'</form>'
].join(''));
res.end();
}else if('/url'==req.url&&req.method=='POST'){
var reqBody='';
req.on('data',function (data) {
reqBody += data;
});
req.on('end',function () {//用于数据接收完成后再获取
res.writeHead(200,{'Content-Type':'text/html'});
res.write('you have sent a '+req.method+' request\n');
res.write('<p>Content-Type:'+req.headers['content-type']+'</p>'
+'<p>Data:your name is '+querystring.parse(reqBody).name+'</p>');
res.end();
})
}else{
res.writeHead(404);
res.write('Not Found');
res.end();
}
}).listen(3000,function () {
console.log('server is listening 3000');
});
提交之后,需要获取请求信息的请求体,因为POST方法中信息都在请求体中,用req绑定data事件获取数据,这里需要注意的是必须得在数据接收完成后再对数据进行操作,即必须绑定end事件监听请求信息是否传输完成。
querystring是查询字符串模块,用于对查询字符串的解析,parse方法将查询字符串解析成一个对象。在git中运行服务器,得到页面是这样的:
提交数据后:
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
如何调试nodejs程序?下面本篇文章给大家介绍一下nodejs调试debug的方法,希望对大家有所帮助!
了解vue首次渲染全过程,我们应该从哪说起呢,很明显,是不是应该从入口文件说起啊,即main.js。今天我们一起来详细的看看vue的首次渲染过程
这篇文章主要给大家探讨vue打包的静态文件不可以直接运行的问题,对于这个问题一些朋友不是很理解,对此本文我们就来了解看看原因及解决方法,感兴趣的朋友可以参考一下,希望大家阅读完这篇文章能有所收获,下面我们一起来学习一下吧。
这篇文章主要介绍了Vue.js前端框架之事件处理小结,本文给大家介绍了v-on 指令的基本用法,通过实例讲解的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
获取标签中value的值使用的javascript获取,所以肯定是包含在 script 标签里的,也需要引入jquery标签示例:input id=goodsCount type=text size=2 readonly=readonly class=num-text value=#{num}获取其中value的值:/
成为群英会员,开启智能安全云计算之旅
立即注册关注或联系群英网络
7x24小时售前:400-678-4567
7x24小时售后:0668-2555666
24小时QQ客服
群英微信公众号
CNNIC域名投诉举报处理平台
服务电话:010-58813000
服务邮箱:service@cnnic.cn
投诉与建议:0668-2555555
Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 ICP核准(ICP备案)粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008