-
post請求參數(shù)不直接在url路徑中拼接，而是放在請求體中發(fā)送給服務(wù)器
- 請求三要素：請求行、請求頭、請求體
-
1.1-瀏覽器發(fā)送post請求參數(shù)的方式
-
post請求參數(shù)不能直接在url路徑中拼接，所以一般使用ajax請求來發(fā)送post請求參數(shù)
- 通常都是提交form表單數(shù)據(jù)使用post請求
-
<script> //瀏覽器中一般使用ajax來發(fā)送post請求 $('#form').on('sunmit', function (e) { //禁用表單默認(rèn)提交事件 e.preventDefault(); $.ajax({ url: 'heroAdd', type: 'post', dataType: 'json', data: $(this).serialize(), success: function (data) { } }); }); </script><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Hero - Admin</title> <!-- 導(dǎo)入jquery --> <script src="/node_modules/jquery/dist/jquery.js"></script> <!-- bootstrap布局 --> <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.css"> <script src="/node_modules/bootstrap/dist/js/bootstrap.js"></script> <style> .hero-list img { width: 50px; } </style> </head> <body> <header> <div class="page-header container"> <h1> <a href="/">王者榮耀</a> <small>英雄管理器</small> </h1> </div> </header> <div class="container hero-list"> <form id="form"> <div class="form-group"> <label for="exampleInputEmail1">英雄名稱</label> <input type="text" name="name" class="form-control" id="exampleInputEmail1" placeholder="請輸入英雄名稱"> </div> <div class="form-group"> <label for="exampleInputPassword1">英雄性別</label> <div class="radio"> <label> <input type="radio" name="gender" id="optionsRadios1" value="男" checked>男 </label> <label> <input type="radio" name="gender" id="optionsRadios1" value="女" checked>女 </label> </div> </div> <div class="form-group"> <label for="exampleInputFile">英雄圖片</label> <!-- <input type="file" id="exampleInputFile"> --> <p class="help-block">請上傳英雄圖片.</p> </div> <button type="submit" class="btn btn-success">點擊保存</button> </form> </div> </body> <script> //瀏覽器中一般使用ajax來發(fā)送post請求 $('#form').on('sunmit', function (e) { //禁用表單默認(rèn)提交事件 e.preventDefault(); $.ajax({ url: 'heroAdd', type: 'post', dataType: 'json', data: $(this).serialize(), success: function (data) { } }); }); </script> </html>1.2-服務(wù)端接收post請求參數(shù)的方式
-
與get請求不同的是，服務(wù)端接收post請求參數(shù)不是一次就可以獲取的，通常需要多次
-
一般post請求發(fā)送的參數(shù)數(shù)據(jù)要比get請求大得多
1.服務(wù)端接收表單數(shù)據(jù)流程（1）如果表單數(shù)據(jù)量越多，則發(fā)送的次數(shù)越多，如果比較少，可能一次就發(fā)過來了
（2）接收表單數(shù)據(jù)的時候，需要通過監(jiān)聽 req 對象的 data 事件來取數(shù)據(jù)
(3)每當(dāng)收到一段表單提交過來的數(shù)據(jù)，req 的 data 事件就會被觸發(fā)一次，同時通過回調(diào)函數(shù)可以拿到該 段 的數(shù)據(jù)
服務(wù)端需要自己添加數(shù)據(jù)流
(4)當(dāng)接收表單提交的數(shù)據(jù)完畢之后，會執(zhí)行req的 on 事件
2.服務(wù)端處理表單數(shù)據(jù)的邏輯流程文章來源：http://www.zghlxwxcb.cn/news/detail-434057.html（1）對數(shù)據(jù)進(jìn)行解碼（中文數(shù)據(jù)提交時會進(jìn)行url編碼）
decodeURI(data)
（2）使用querystring對url進(jìn)行反序列化（解析url將&和=拆分成鍵值對），得到一個對象
querystring是nodejs內(nèi)置的一個專用于處理url的模塊，API只有四個，詳情見nodejs官方文檔
post請求參數(shù)不能使用url模塊解析，因為他不是一個url，而是一個請求體對象
（3）將數(shù)據(jù)插入到數(shù)據(jù)庫
?文章來源地址http://www.zghlxwxcb.cn/news/detail-434057.html -
//導(dǎo)入querystring模塊（解析post請求數(shù)據(jù)） var querystring = require('querystring'); console.log(req.method); //1.通過判斷url路徑和請求方式來判斷是否是表單提交 if (req.url === '/heroAdd' && req.method === 'POST') { /**服務(wù)端接收post請求參數(shù)的流程 * （1）給req請求注冊接收數(shù)據(jù)data事件（該方法會執(zhí)行多次，需要我們手動累加二進(jìn)制數(shù)據(jù)） * * 如果表單數(shù)據(jù)量越多，則發(fā)送的次數(shù)越多，如果比較少，可能一次就發(fā)過來了 * * 所以接收表單數(shù)據(jù)的時候，需要通過監(jiān)聽 req 對象的 data 事件來取數(shù)據(jù) * * 也就是說，每當(dāng)收到一段表單提交過來的數(shù)據(jù)，req 的 data 事件就會被觸發(fā)一次，同時通過回調(diào)函數(shù)可以拿到該 段 的數(shù)據(jù) * （2）給req請求注冊完成接收數(shù)據(jù)end事件（所有數(shù)據(jù)接收完成會執(zhí)行一次該方法） */ //創(chuàng)建空字符疊加數(shù)據(jù)片段 var data = ''; //2.注冊data事件接收數(shù)據(jù)（每當(dāng)收到一段表單提交的數(shù)據(jù)，該方法會執(zhí)行一次） req.on('data', function (chunk) { // chunk 默認(rèn)是一個二進(jìn)制數(shù)據(jù)，和 data 拼接會自動 toString data += chunk; }); // 3.當(dāng)接收表單提交的數(shù)據(jù)完畢之后，就可以進(jìn)一步處理了 //注冊end事件，所有數(shù)據(jù)接收完成會執(zhí)行一次該方法 req.on('end', function () { //（1）.對url進(jìn)行解碼（url會對中文進(jìn)行編碼） data = decodeURI(data); console.log(data); /**post請求參數(shù)不能使用url模塊解析，因為他不是一個url，而是一個請求體對象 */ //（2）.使用querystring對url進(jìn)行反序列化（解析url將&和=拆分成鍵值對），得到一個對象 //querystring是nodejs內(nèi)置的一個專用于處理url的模塊，API只有四個，詳情見nodejs官方文檔 var dataObject = querystring.parse(data); console.log(dataObject); }); }//1.導(dǎo)入http模塊 var http = require('http'); //導(dǎo)入文件模塊 var fs = require('fs'); //導(dǎo)入路徑模塊 var path = require('path'); //導(dǎo)入querystring模塊（解析post請求數(shù)據(jù)） var querystring = require('querystring'); //2.創(chuàng)建服務(wù)器 var app = http.createServer(); //3.添加響應(yīng)事件 app.on('request', function (req, res) { console.log(req.method); //1.通過判斷url路徑和請求方式來判斷是否是表單提交 if (req.url === '/heroAdd' && req.method === 'POST') { /**服務(wù)端接收post請求參數(shù)的流程 * （1）給req請求注冊接收數(shù)據(jù)data事件（該方法會執(zhí)行多次，需要我們手動累加二進(jìn)制數(shù)據(jù)） * * 如果表單數(shù)據(jù)量越多，則發(fā)送的次數(shù)越多，如果比較少，可能一次就發(fā)過來了 * * 所以接收表單數(shù)據(jù)的時候，需要通過監(jiān)聽 req 對象的 data 事件來取數(shù)據(jù) * * 也就是說，每當(dāng)收到一段表單提交過來的數(shù)據(jù)，req 的 data 事件就會被觸發(fā)一次，同時通過回調(diào)函數(shù)可以拿到該 段 的數(shù)據(jù) * （2）給req請求注冊完成接收數(shù)據(jù)end事件（所有數(shù)據(jù)接收完成會執(zhí)行一次該方法） */ //創(chuàng)建空字符疊加數(shù)據(jù)片段 var data = ''; //2.注冊data事件接收數(shù)據(jù)（每當(dāng)收到一段表單提交的數(shù)據(jù)，該方法會執(zhí)行一次） req.on('data', function (chunk) { // chunk 默認(rèn)是一個二進(jìn)制數(shù)據(jù)，和 data 拼接會自動 toString data += chunk; }); // 3.當(dāng)接收表單提交的數(shù)據(jù)完畢之后，就可以進(jìn)一步處理了 //注冊end事件，所有數(shù)據(jù)接收完成會執(zhí)行一次該方法 req.on('end', function () { //（1）.對url進(jìn)行解碼（url會對中文進(jìn)行編碼） data = decodeURI(data); console.log(data); /**post請求參數(shù)不能使用url模塊解析，因為他不是一個url，而是一個請求體對象 */ //（2）.使用querystring對url進(jìn)行反序列化（解析url將&和=拆分成鍵值對），得到一個對象 //querystring是nodejs內(nèi)置的一個專用于處理url的模塊，API只有四個，詳情見nodejs官方文檔 var dataObject = querystring.parse(data); console.log(dataObject); }); } if (req.url === '/heroAdd' && req.method === 'POST') { fs.readFile('./heroAdd.html', function (err, data) { if (err) { throw err; } res.end(data); }); } else if (req.url.indexOf('/node_modules') === 0) { fs.readFile(__dirname + req.url, function (err, data) { if (err) { throw err; } else { res.end(data); } }); } else { res.end('請求路徑： ' + req.url); } }); //4.監(jiān)聽端口號 app.listen(3000, function () { console.log('歡迎來到王者榮耀英雄管理器'); });
到了這里，關(guān)于nodejs接收post請求的參數(shù)的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
