第一次做node.js项目,借助简单注册登录了解一下node.js到底怎么运行的,如何载入html文件 又如何响应用户请求和如何回应的。。。
建立一个空node.js工程,自己往里面添加2个html文件,一个是注册,一个是登录
注册.html
1 <form action="/reg" method="post"> 2 <div class='left-text'> 3 <sapn>用户名:</sapn> 4 <input type="text" name="usename"> 5 </div> 6 <div class="left-text"> 7 <span>密码:</span> 8 <input type="password" name="password"> 9 </div> 10 <div class="foot"> 11 <button type="submit">注册</button> 12 </div> 13 </form>
登录.html
1 <form action="/log" method="post"> 2 <div class='left-text'> 3 <sapn>用户名:</sapn> 4 <input type="text" name="usename"> 5 </div> 6 <div class="left-text"> 7 <span>密码:</span> 8 <input type="password" name="password"> 9 </div> 10 <div class="foot"> 11 <button type="submit">登录</button> 12 </div> 13 </form>
登录界面
借助这句话进入
1 <a href="/login">登录</a>
然后就是很重要的服务器js代码,这个是启动node.js的一个入口
1 var http = require('http');//http用来创建服务器,提供request和response的,类似servlet 2 var url=require('url');//url用来指定用户请求的地址,类似action 3 var fs=require('fs');//fs用来载入文件,比如html 4 var querystring=require('querystring');//querystring,它是转化字符串为json对象 5 6 http.createServer(function handler(req, res) {//创建node.js服务器 7 console.log("req.url",req.url);//网页控制台打印信息,req.url指的是请求路径地址和后面的值 8 var pathname=url.parse(req.url).pathname;//这句话是只获取请求路径地址,不包含后面的值 9 if(pathname=='/'){//当在浏览器输入localhost:3000/执行下面代码 10 fs.readFile('reg.html',function(err,data){//fs读取注册页面,后面的function是回调函数,通过它 实现了node.js的异步机制,简单来说就是边读取注册文件,边执行这句话之后的事件,因为后面没有事件就不用管它,然后如果读取成功,便将文件内容存到data中,如果读取错误,便会把错误信息放到err里,因为这个比较简单根本不回读错,所以直接把data的值用res返回去,其中定义了返回值的格式为html 11 res.writeHead(200,{'Content-Type':'text/html'});//定义返回值的以网页的形式返回 12 res.end(data);//这个end就是返回数据的语句,如果服务器又返回客户端的值,则用res.send(),如果没有,则用end,什么意思????这个我还不是特别明白 13 }); 14 }else if(pathname=='/reg'&& req.method=='POST'){//这个当你填写好注册信息选择提交时的处理事件 15 console.log("注册提交数据"); 16 var data=''; 17 req.on('data',function(chunk){//这句话非常重要前面的‘data’,我觉得是指定用户的输入,不包含html,而后面的function(chunk)意思是把用户的输入存到chunk里 18 data+=chunk;//data变量存储所有用户的输入,这里得到的是是一个字符串数组 19 console.log(data);//打印字符串 20 }).on('end',function(){//这里的‘end’意思是请求数据已经接收结束,我猜的,在结束之前处理下面的事件 21 var tt=querystring.parse(data);//将得到的字符串数组转化成json对象 22 console.log(tt);//打印出json对象 23 fs.writeFile('reg.json',JSON.stringify(tt),'utf-8',function(err){//然后把json对象转化成字符串加入到reg.json文件里,因为原函数定义的就是string或buffer类型的,虽然是json文件,但还是要字符串才能加入,不懂 24 if(err){ 25 return res.end('注册失败');//如果加入成功,注册成功 26 }else { 27 return res.end('注册成功');//加入失败,注册失败 28 } 29 }); 30 }) 31 32 }else if(pathname=='/login' ){//当点击登录按钮启动 33 fs.readFile('login.html',function(err,data){//载入登录页面,和上面一样成功的话显示登录界面信息 34 res.writeHead(200,{'Content-Type':'text/html'}); 35 res.end(data); 36 }) 37 }else if(pathname=='/log' && req.method=='POST'){//用户填好登录信息并选择登录触发 38 fs.readFile('reg.json',function(err,data){//读取注册信息 39 var regdata=""; 40 regdata=JSON.parse(data.toString());//将它转化成json对象,目的的是下面比对 41 console.log('注册信息',regdata); 42 43 var logindata=''; 44 req.on('data',function(chunk){//读取用户输入的登陆信息并把它保存到logindata对象里 45 logindata+=chunk; 46 }).on('end',function(){//同样在请求接受结束前处理下面事件 47 var tt2=querystring.parse(logindata);//将登陆信息字符串变成json对象 48 console.log(tt2); 49 if(tt2.usename==regdata.usename && tt2.password==regdata.password){//比对注册对象的值和登陆对象的值 50 return res.end('登陆成功');//比对成功则成功, 51 }else{ 52 return res.end('登陆失败');//失败则失败 不过纳闷的是为什么没设置res的返回值格式 53 } 54 }); 55 }) 56 } 57 58 }).listen(1337, '127.0.0.1');//监听1337窗口 59 60 console.log('Server running at http://127.0.0.1:1337/');
上面代码注解都是本人个人理解 当然还有很多不明白的地方