课时82-课时86笔记.md

2018-11-29 本文已影响11人九旬大爷的梦

课时82 Express-小撩-注册上

先处理register.ejs的form提交方式改成post，
register.ejs:

    <form action="/" method="post">
        <p>账号：<input type="text" name="name"></p>
        <p>密码：<input type="password" name="pwd"></p>
        <input type="submit" value="提交">
    </form>

然后让注册成功之后跳到主页，也就是把action='/'，然后在主页里接受注册时[图片上传中...(111543388573_.pic.jpg-a7d9c2-1543388576693-0)]
提交的数据。
index.js:

//register时的post请求 
router.post('/', function(req, res, next) {
  //1. 获取提交的数据
  let name= req.body.name;
  let pwd= req.body.pwd;
  console.log(name,pwd);
});

131543388690_.pic.jpg

课时83 Express-小撩-注册下

提交注册表单之后应该先判断数据库中是否有这个用户名:

如果用户名存在，那跳转到登录页面
如果不存在，那就注册成功，然后跳转到登录页面

可以使用mongoose直接查询( find() )数据库，该用户名是否存在，如果不存在的话就直接插入( inset() ) 。
注册成功后密码存储的话应该使用md5加密，登录验证时在解密

但是在这里使用一个变量（充当数据库）接收注册的用户名和密码。

课时84 Express-小撩-登录

新建一个util文件，把验证用户名的函数存放在这里，然后使用exprots或者module.exprots暴露出去。
关于这两者区别请看-->module.exports vs exports-廖雪峰的官方网站-node.js

存放在外部的共用的值和方法util.js:

//存放数据
exports.users= [];

//判断提价的用户名是否存在
exports.isReg= (userObj, users)=>{
    for(var i=0; i<users.length; i++){
      //取出单个用户对象
      let user= users[i];
      console.log('注册表',users[i])
      //判断
      if(user.userName === userObj.userName){
          return user;
      }
    }
  }

在登陆和注册需要验证的情况下都需要以下几步：

前提是在登陆和注册中都require了util.js，因为只有引用了它才能使用验证和存贮。

先获取登陆/注册的账户和密码

  //1. 获取提交的数据
  let name= req.body.name;
  let pwd= req.body.pwd;
  //2. 处理数据
  //2.1 生成用户注册对象
  let loginUser = {
    userName : name,
    loginPwd : pwd
  }

登陆时
2.1.判断是否注册
2.2.判断密码是否正确

 //2.2 验证用户是否注册
   console.log(loginUser)
   let user= util.isReg(loginUser, util.users);
   if(user !== null && user!== undefined){
     //用户存在
    if(user.loginPwd === loginPwd){
      res.send("登陆成功，欢迎" + user.userName + ",<a href='/'> 返回主页</a>")
      res.redirect('/');
    }else{
      res.send('密码错误')
    }
   }else{
     //用户不存在
      res.send("用户不存在，请<a href='/register'> 去注册</a>");
   }
});

跳转使用重定向：res.redirect('/')

课时85 Express-小撩-配置聊天界面

添加一个chat.ejs 表示聊天机器人的页面，对应添加routes、app.js的配置和前面一样，
只有登陆后，才能显示聊天机器人：

    <% if(name !== '小乐'){ %>
    <p>
      <a href="/chat">去找小乐聊天</a>
    </p>
    <% } %>

如何给添加views中.ejs文件所需要的静态文件（css/js/images）:
在app.js中注意如没有请添加上这句

//获取放置在public文件夹下的静态文件,
app.use(express.static(__dirname + '/public'));

关于app.use()这个方法具体的介绍，这里有篇文章，写的很好app.use(express.static)方法详解
Express细节探究(1)——app.use(express.static)
这样，就可以在ejs文件中导入外部静态文件了。
这里需要注意一点，在导入写URL时，只需要写public后面的路径就好，不需要再加上“public”了。如下：

<link rel="stylesheet" type="text/css" href="table.css"/>
<script type="text/javascript" src="table.js"></script>

BootCDN稳定免费快速的前端CDN加速服务

课时86 Express-小撩-socket.IO简介

socket.io 是用于构建实时通讯服务的框架。

2018-11-29_151505.jpg

socket官网