美文网首页
课时82-课时86笔记.md

课时82-课时86笔记.md

作者: 九旬大爷的梦 | 来源:发表于2018-11-29 15:24 被阅读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. 先获取登陆/注册的账户和密码
      //1. 获取提交的数据
      let name= req.body.name;
      let pwd= req.body.pwd;
      //2. 处理数据
      //2.1 生成用户注册对象
      let loginUser = {
        userName : name,
        loginPwd : pwd
      }
    
    1. 登陆时
      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官网

    相关文章

      网友评论

          本文标题:课时82-课时86笔记.md

          本文链接:https://www.haomeiwen.com/subject/kymgqqtx.html