1.1請求參數(shù)
當客戶端向服務(wù)器端做出請求時黍氮,需要額外的攜帶一些數(shù)據(jù)唐含,這些數(shù)據(jù)需要通過請求參數(shù)傳遞過去。
例如:①常見的登錄操作沫浆,用戶在表單中輸入用戶名和密碼后捷枯,需要登錄,而用戶名和密碼需要通過某種形式傳遞到服務(wù)器端专执,服務(wù)器端要獲取到用戶輸入的內(nèi)容淮捆,因為服務(wù)器端要驗證。
是怎樣一個傳遞過程呢本股?
答:通過請求參數(shù)傳遞過去争剿。
②在網(wǎng)站的后臺發(fā)布一些文章的信息,我們要在表單中痊末,輸入文章的標題蚕苇,文章的發(fā)布日期,文章的封面以及文章的內(nèi)容凿叠,那么這些在表單當中輸入的信息涩笤,也是通過請求參數(shù)傳遞給服務(wù)端的。
請求參數(shù)分為兩種:GET,POST
1.2GET請求參數(shù)
參數(shù)被放置在瀏覽器地址欄中盒件,例如:
http://localhost:3000//?name=zhangsan&age=20
?代表后面就是請求的參數(shù)蹬碧,就是我們需要額外攜帶的數(shù)據(jù),數(shù)據(jù)實際上就是鍵值對炒刁,以=進行分割恩沽,如果想要傳遞多個信息,以&符進行分割翔始。
服務(wù)器端獲取這個請求參數(shù)罗心,怎么獲取,通過name或者age去獲取具體的zhangsan或者說20.
①要獲取城瞎,首先要在客戶端請求時傳遞渤闷,
②切換到瀏覽器,在地址欄中輸入一個/index脖镀?name=zhangsan&age=20(回車發(fā)送請求)
③返回:not found
輸出req.url
console.log(req.url)
命令行工具顯示:/index?name=zhangsan&age=20
怎么得到req.url中的請求參數(shù)得到飒箭。
①字符串截取(麻煩)
②node.js中提供了內(nèi)置模塊蜒灰,讓我們通過內(nèi)置模塊的方法處理這個請求參數(shù)
在node.js提供了內(nèi)置模塊url模塊
const url = require('url');? ? ? ? ?// 用于處理url地址
url.parse(req.url)? ? ? ? ? ? ? // 解析:最終返回一個對象
console.log(url.parse(req.url));
其中:search,query
pathname
處理后還是不方便弦蹂,
parse(req.url,true);? // 1要解析的url地址2將查詢參數(shù)解析成對象形式
console.log(url.parse(req.url,true));
瀏覽器中刷新頁面强窖,切換到命令行窗口觀察:
query:{name:'zhangsan',age:'20'}
獲取請求參數(shù)
let params = url.parse(req.url,true).query;
console.log(params.name);
console.log(params.age);
刷新瀏覽器凸椿,切換命令行工具:獲取到了zhangsan,20
!1下狻削饵!之前寫的判斷岩瘦,在加了查詢參數(shù)后失效,窿撬,要判斷什么启昧?判斷客戶端的請求地址。
req.url既有請求地址劈伴,又有請求參數(shù)密末,所以這時候不能拿req.url直接去判斷。
獲取到pathname:去做判斷
let {query,pathname} = url.parse(req.url,true);
if(pathename == '/index' || pathname == '/'){
? ? ? ? ? ? ? ? res.end('<h2>歡迎來到</h2>')跛璧;
}else if(pathname == '/list' ){
? ? ? ? ? ? ? ? res.end('welcome to listpage');
}else{
res.end('not found');
}
1.3POST請求參數(shù)
①怎么樣從客戶端發(fā)送請求參數(shù)到服務(wù)端严里、
②如何在服務(wù)器端接收這些請求參數(shù)
切換到form.html中,在form標簽中
<input type="text" name="username">
<input type="password" name=" password ">
<input type="submit">
當用點擊提交按鈕追城,把用戶名和密碼提交到服務(wù)端刹碾,要如何接收參數(shù)呢(GET請求服務(wù)器端是通過參數(shù)的名字去接收的,POST請求也不例外)座柱,在input上有個name屬性迷帜,用來指定當前這個表單項的名字,那么把第一個指定成username色洞,第二個指定成password保存.
GET請求參數(shù)是放在地址欄中進行傳輸?shù)南非拢琍OST請求參數(shù)不在地址欄中,而在請求報文中火诸。
右鍵在瀏覽器中打開當前頁面锦针,在瀏覽器控制臺打開Network,輸入用戶名以及密碼置蜀,點擊提交奈搜。
出現(xiàn)Headers中出現(xiàn)Form Data在這里出現(xiàn)了username,password。(瀏覽器為了讓我們更加明白清楚的觀察這個參數(shù)盾碗,實際上把POST參數(shù)做了顯示上的優(yōu)化媚污,實際上格式和GET餐護士格式一樣舀瓢,點擊view source,現(xiàn)在看到的格式就一樣了)
②服務(wù)器端接收參數(shù)
新建文件post.js
const http =require('http');
const app =http.createServer();
const querystring = require('querystring');? ?// 處理請求參數(shù)模塊
app.on('request',(req,res)=>{
// post參數(shù)是通過事件的方式接收的
// data 當請求參數(shù)傳遞的時候觸發(fā)data事件
// end當參數(shù)傳遞完成的時候觸發(fā)end事件
? ? ? ? let postParams = '';
? ? ? ? req.on('data',params=>{
? ? ? ? ? ? ? postParams+=params;
? ? ? ? });? ?
? ? ? ? req.on('end',()=>{
? ? ? ? ? ? ? ? ? //? console.log(postParams);
? ? ? ? ? ? ? ? ?console.log( querystring.parse(postParams)? );
? ? ? ? });
? ? ? ? res.end('OK');
});
app.listen(3000);
console.log('網(wǎng)站服務(wù)器啟動成功')
PS:post參數(shù)在理論上數(shù)據(jù)量是無限的廷雅,所以作為服務(wù)器為了減輕壓力,post參數(shù)不是一次就可以接收完的京髓,比如說傳遞了個100M的數(shù)據(jù)航缀,可能分10次接收,每次就收10M堰怨,當要請求參數(shù)傳輸時芥玉,就會觸發(fā)data事件,當請求參數(shù)傳遞完成的時候觸發(fā)end事件备图。
切換到命令行:node post.js? ? ? ? ? ? // 啟動網(wǎng)站服務(wù)器
const querystring = require('querystring');? //node.js中的內(nèi)置模塊:處理請求參數(shù)模塊
該模塊中有一個方法parse灿巧,能將字符串轉(zhuǎn)成對象模式
切換到瀏覽器中赶袄,輸入用戶名,密碼抠藕。提交饿肺,控制臺中就有一個對象,有這個請求參數(shù)
小結(jié):·對于POST請求參數(shù)而已盾似,它的參數(shù)是被放置在請求體中進行傳輸?shù)木蠢保^請求體就是放在了請求報文中參數(shù),而GET請求參數(shù)零院,是被放在了地址中傳輸溉跃。
·獲取POST請求參數(shù)要用到data事件以及end()事件。而獲得GET參數(shù)使用req.url就可以了告抄。
·獲取到POST參數(shù)依然是一個字符串格式撰茎,要把他轉(zhuǎn)換成對象形式,就要使用內(nèi)置模塊querystring,在這個模塊下有一個方法parse,他可以把字符串類型的請求參數(shù)轉(zhuǎn)換成對象類型打洼。