普通頁面沒有報(bào)錯(cuò) 訪問localhost:8080/login.html就報(bào)錯(cuò)

//app.js文件

const?http?=?require('http')?//引進(jìn)http就是創(chuàng)建服務(wù)器

const?url?=?require('url')

const?querysring?=?require('querystring')

const?fs?=?require('fs')

let?user?=?{

????//用json代替/假裝數(shù)據(jù)庫，存的用戶的（登錄）數(shù)據(jù)

????admin:?123456

}

http.createServer((req,?res)?=>?{

????//獲取數(shù)據(jù)

????let?path,?get,?post

????if?(req.method?==?'GET')?{

????????let?{?pathname,?query?}?=?url.parse(req.url,?true)

????????path?=?pathname,

????????????get?=?query?//吧數(shù)據(jù)放到外面去,get數(shù)據(jù)

????????complete()

????}?else?if?(req.method?==?'POST')?{

????????let?arr?=?[]

????????req.on('data',?buffer?=>?{

????????????arr.push(buffer)?//暫時(shí)拿到了buffer

????????})

????????req.on('end',?()?=>?{

????????????post?=?querystring.parse(Buffer.concat(arr).toString())

????????????????//concat()方法吧數(shù)組平起來，二進(jìn)制轉(zhuǎn)為toString變成人能看的東西，如果是文件不能用toString

????????????????//querystring也是一個(gè)parse,處理成我們喜歡的string

????????})

????????complete()

????}

????function?complete()?{

????????//響應(yīng)頭，狀態(tài)碼200成功，寫在這里不太好，到時(shí)候ajax去寫是不會(huì)亂碼的，寫在最外層是因?yàn)榈卿浐妥詍sg都有中文寫一次可以共同去用

????????//?res.writeHead(200,?{

????????//?????????"Content-Type":?"text/plain;charset=utf-8"

????????//?????})?//將亂碼轉(zhuǎn)換為編碼（msg亂碼了）

????????if?(path?==?'/login')?{

????????????if?(!user[username])?{

????????????????res.writeHead(200,?{

????????????????????"Content-Type":?"text/plain;charset=utf-8"

????????????????})

????????????????//登錄

????????????????let?{?username,?password?}?=?get

????????????????//拿到的get數(shù)據(jù)，判斷數(shù)據(jù)庫有沒有,username,password是確定的名字?

????????????????//判斷如果是用戶的密碼登錄成功

????????????????res.end(JSON.stringify({

????????????????????????err:?1,

????????????????????????msg:?"用戶名不存在",

????????????????????}),?//end?只能用字符串和buffer,用JSON.stringify轉(zhuǎn)換為字符串???//end是一個(gè)回調(diào)

????????????????)

????????????}?else?if?(user[username]?!=?password)?{

????????????????res.end(JSON.stringify({

????????????????????err:?1,

????????????????????msg:?"密碼錯(cuò)誤"

????????????????}))

????????????}?else?{

????????????????res.end(JSON.stringify({

????????????????????????err:?0,

????????????????????????msg:?"登錄成功"

????????????????????}))?//成功?err為0

????????????}

????????}?else?if?(path?==?'/reg')?{

????????????res.writeHead(200,?{

????????????????"Content-Type":?"text/plain;charset=utf-8"

????????????})

????????????//注冊

????????????let?{?username,?password?}?=?post

????????????if?(user[username])?{

????????????????//先從錯(cuò)誤的判斷，已經(jīng)注冊的話告訴用戶不好意思

????????????????res.end(JSON.stringify({

????????????????????err:?1,

????????????????????msg:?"賬號(hào)已經(jīng)存在"

????????????????}))

????????????}?else?{

????????????????res.end(JSON.stringify({

????????????????????err:?0,

????????????????????msg:?"注冊成功"

????????????????}))

????????????}

????????}?else?{

????????????//fs讀取的

????????????fs.readFile(`www${path}`,?(err,?data)?=>?{

????????????????if?(err)?{

????????????????????res.end('404')

????????????????}?else?{

????????????????????res.end(data)?//這個(gè)data就是buffer直接end就可以

????????????????}

????????????})

????????}

????}

}).listen(8080)

//let?path,get,post?路徑?get數(shù)據(jù)?post數(shù)據(jù)

//?get有個(gè)url的路徑?

//let{pathname,query}=url.parse(req.url,true)?parse（是解析一下,好像是數(shù)組解析）true(是split)

//post?比較復(fù)雜?是異步

//在if塊最后，在else?if塊最后，不可能做兩個(gè)事情，創(chuàng)建一個(gè)完成的函數(shù)，在if,else?if塊最后執(zhí)行

//get請求寫完?測試(沒有用到之前的form.html文件)?命令行輸入這個(gè)node?app??在瀏覽器輸入localhost:8080/login?username=zhangsan&password=123456?

//顯示{"err":1,"msg":"鐢ㄦ埛鍚嶄笉瀛樺湪"}，這個(gè)字符串沒報(bào)錯(cuò)，是亂碼，因?yàn)閙sg:中文，（到時(shí)候ajax去寫是不會(huì)亂碼的）

//將亂碼轉(zhuǎn)換為編碼，重新執(zhí)行，顯示{"err":1,"msg":"用戶名不存在"}

//post寫完沒辦法跟get請求一樣測試，要用ajax,在node文件夾下建一個(gè)www的文件夾,www文件夾里面有l(wèi)ogin.html,這個(gè)靜態(tài)文件訪問不了（localhost:8080/login.html，因?yàn)楝F(xiàn)在還沒有寫過），

//用fs模塊讀取這個(gè)文件,訪問（localhost:8080/login.html），顯示字符串，被編碼影響了，吧編碼重新放在登錄，注冊if塊和else?if塊最前面?(命令行和網(wǎng)址輸入，顯示登錄框)

//login.html?登錄頁面引入jquery.min.js,開始寫ajax(在html頁面寫)

//login.html文件

<!DOCTYPE?html>

<html?lang="en">

<head>

????<meta?charset="UTF-8">

????<meta?name="viewport"?content="width=device-width,?initial-scale=1.0">

????<meta?http-equiv="X-UA-Compatible"?content="ie=edge">

????<title>Document</title>

????<script?src="jquery.min.js"></script>

</head>

<body>

????用戶名：<input?type="text"?id="username"><br/>?密碼：

????<input?type="password"?id='password'><br/>

????<button?id="login">登錄</button><br/>

????<button?id="reg">注冊</button><br/>

????<script>

????????$('#login').click(function()?{

????????????$.ajax({

????????????????url:?"/login",

????????????????data:?{

????????????????????username:?$('#username').val(),

????????????????????password:?$('#passwor').val()

????????????????},

????????????????dataType:?"json",

????????????????success(res)?{

????????????????????//執(zhí)行成功返回的是json值

????????????????????if?(res.err)?{

????????????????????????alert(res.mag)

????????????????????}?else?{

????????????????????????alert("登錄成功")

????????????????????}

????????????????}

????????????})

????????})

????</script>

</body>

</html>