分享

nodejs 笔记

 忘川书阁 2018-04-11
nodejs 笔记
  (1)nodejs定义
      运行在服务器端软件
  (2)作用
    <1>解析和执行JavaScript代码
    <2>搭建http服务器
  (3)特点
     <1>单线程
         多线程:php apache ,客户端每发一个请求,apache就会创建一个进程去处理,优点:稳定性高,缺点:单兵作战能力不强
         单线程: node ,客户端发送的所有请求都交给服务端创建的同一个进程处理,优点:单兵作战能力强,缺点:稳定性较差
     <2>异步非阻塞I/O
          同步:
          php:
          mysqli_query("select * from stu where name like '%ss%'");
          echo "1111";
          异步:
          $.get("01.php",{name:sss},function(data){});
          alert('ssss');
          I/O:对数据的输入和输出 I input  O output
    <3>事件驱动:
       事件:当鼠标或者键盘操作文本档的时候,就会产生事件 onclick ondblclick onmouseover onmouseout ....
       事件驱动:当产生事件的时候,就会调用程序去处理事件,达到效果,处理的过程叫做事件驱动
     <4>稳定性较差
     <5>npm包管理工具
        npm包:
        a.定义
        通俗:类似于qq管家,360管家,appstore....
        专业:类似于linux下的yum和composer
        b.作用
        可以快速的安装软件
  (4)安装
    windows
    linux 
    console.log 服务器输出
  (5)http协议
//1.引入node的内置 http模块
var http=require("http");
//2.创建服务
var server=http.createServer(function(req,res){
    // req=>请求报文(请求对象)-》request
    //res=>响应报文=》response
    //返回响应数据
    res.end('ok');
});
//3.监听端口
server.listen(8080);

//1.引入http
var http=require("http");
//2.创建服务
var server=http.createServer(function(req,res){
    //获取请求方法
    // var method=req.method;
    //获取请求路径
    // var url=req.url;
    //协议版本
    // var httpVersion=req.httpVersion;
    //获取请求头
    var headers=req.headers;
    //获取主机
    // var host=headers.host;
    //获取用户表头信息
    // var useragent=headers['user-agent'];
    console.log(useragent);
    res.end('ok');
});
//3.监听端口
server.listen(8090);

1.响应(重点)
2.静态资源请求处理(重点)
3.页面处理(重点)
4.表单处理(重点)
5.npm 使用(重点)
  出现错误:
    防火墙关闭
    检查网络请求
  (1)使用
     <1>初始化npm
        npm init --yes
        package.json  用来记录安装信息
1.url 模块提供url的一些函数,解析和处理url
  引入url模块
  url=require('url');
  url.parse()->解析url参数
2.响应数据返回的类型
  (1)字符串
  (2)页面
    res.write(`<!doctype html>
                <html>
                <head>
                    <meta charset='utf-8'>
                    <title>父窗口</title>
                </head>
                <body>
                    <div style='width:100%;height:200px;background-color:red'></div>    
                </body>
                </html>`);
    注意:返回的页面都是以反引号包含
  (3)json字符串
   在node js里对象是不能直接输出的
   第一种:`{}`
   第二种:JSON.stringify 把对象转换为字符串 输出
3.静态资源
   js  css img 插件
4.fs (文件系统模块) 操作文件
  读取静态资源
  wamp php 可以自动读取到静态资源
  node 读取静态资源的时候 用fs模块读取
  (1)导入fs
      fs=require('fs');
      fs.readFile('静态资源所在路径',function(err,data){
          if(err) throw error;
          res.end(data);
          })
5.查询字符串模块
qs=》获取url查询的参数
qs=require('querystring');
qs.parse()->解析url查询的字符串-》把参数转换为json

----------nodejs_03-------------
1.npm 介绍和使用(重点)
   npm 类似于composer(操作wamp)
   安装laravel:
   composer create-project laravel/laravel your-project-name --prefer-dist "5.1.*"
   安装TP5:
   composer create-project topthink/think tp5  --prefer-dist
   (2)mysql使用
2.模块化 (重点)  
3.node js  express 框架(重点)
   (1)安装
   (2)使用
4.模板引擎(ejs)(重点)
  node js 代码和html代码分离
---------------------------------
1.mysql 模块的使用
连接数据库
    var connection = mysql.createConnection({
        host     : 'localhost',
        user     : 'root',
        password : '123',
        database : 'o2o_15'
      });
       
      connection.connect();
       
       执行sql语句  results 查询的结果
      connection.query('select * from stu', function (error, results, fields) {
        if (error) throw error;
        console.log('result: ', results);
        res.end('ok');
      });      
       关闭数据库
      connection.end();
      预处理:
      sql="delete from table where id=?";
      绑定值
      deletes=[绑定值];
      返回预处理
      mysql.format(sql,deletes);
2.npm 模块化
为什么要使用模块化:
可以实现吧js代码分配到不同的js里
exports 把相对应得功能开放出去 例如:函数 json...
3.模块化  引入文件夹  默认访问当前文件夹下的index.js
4.框架: 能够快速的实现项目需求  php  ThinkPHP  Laravel ci  yii  zend  framework wordpress..  JS Jquery  bootstrap  node  express
5.路由其实就是指导工具,TP5 请求控制器下的方法时候,路由可以给规定请求方式和请求路径
  使用路由:简化url路径,有利于网站收录排名
  使用
  一旦匹配到路由规则 自动调用匿名函数 做处理
  app.get('路由规则',function(req,res){
  res.end();
})
6.响应数据返回的类型 :
字符串  页面  跳转
res.redirect();
7.express  模板引擎  ejs 把html和nodejs代码分离 (jade)  smarty
   (1)安装ejs
      npm install ejs --save
   (2)导入ejs
      app.use(express.static('node_modules'));
   (3)设置模板引擎类型
    app.set('view engine','ejs');
   (4)设置模板存放路径
    app.set('views','./views');
   (5)加载模板  res.render('模板的名字');
nodejs_04
2.学生信息管理模块(重点)
//引入express
var express=require("express");
//表单处理工具
var formidable=require("formidable");
//导入mysql
var mysql=require("mysql");
//引入url
var urlTool=require("url");
//引入cookie-parser
var cookieParser=require("cookie-parser");
//创建应用
var app=express();
//读取静态资源
app.use(express.static("node_modules"));
//设置模板引擎类型
app.set("view engine","ejs");
//设置模板路径
app.set("views","./view");
//使用cookie-parser
app.use(cookieParser());
//配置数据库
var connection = mysql.createConnection({
  host     : 'localhost',
  user     : 'root',
  password : '123',
  database : 'o2o_19'
});
//连接数据库
connection.connect();
//设置路由
app.get("/login",function(req,res){
    // res.end('ok');
    //加载模板
    res.render("login");
});
//设置路由
app.post("/dologin",function(req,res){
    //实例化
    var form = new formidable.IncomingForm();
    //解析参数
    form.parse(req, function(err, fields, files) {
     //获取 name 和pass
     var name=fields.name;
     var pass=fields.pass;
     //检测用户名
     connection.query('select * from stu where name="'+name+'"', function (error, results, fields) {
      if (error) throw error;
      // console.log('The solution is: ', results[0].solution);
      if(results.length<=0){
          //设置字符集  {charset:utf8}  res.setHeader('content-
          //type','text/html;charset=utf-8');  res.end("用户名有误");
          res.redirect("/login");
      }else{
          // res.end('ok');
          //对密码做检测
          // console.log(results[0].pass);
          if(pass==results[0].pass){
              //cookie设置
              //name cookie名  maxAge 最大生存时间(单位为毫秒) httpOnly(使用http协议设置cookie)
              res.cookie('name', name, { maxAge: 900000, httpOnly: true })
              //跳转到后台界面
              res.redirect("/index");
          }else{
              //跳转到登录界面
              res.redirect("/login");
          }
          
      }
    });
    });
});
//后台首页
app.get("/index",function(req,res){
    //对cookie 做检测
    // cookie-parser
    if(!req.cookies.name){
        //跳转到登录界面
        res.redirect("/login");
    }
    res.end("this is admin");
});
//user 列表
app.get("/user",function(req,res){
    //获取信息
    connection.query('select * from stu', function (error, results, fields) {
      if (error) throw error;
              //加载模板 分配数据
              res.render("user",{users:results});
        });
    
});
//添加
//加载添加模板
app.get("/add",function(req,res){
    res.render("add");
});
//执行添加
app.post("/insert",function(req,res){
    // res.end('ok');
    //获取需要添加的信息
    var form = new formidable.IncomingForm();
    form.parse(req, function(err, fields, files) {
      var name=fields.name;
      var pass=fields.pass;
      //预处理
      sql="insert into stu (name,pass) values(?,?)";
      inserts=[name,pass];
      sql=mysql.format(sql,inserts);
      //执行sql语句 做数据插入
      connection.query(sql, function (error, results, fields) {
      if (error) throw error;
      // console.log(results);
      // res.end('ok');
      if(results.affectedRows>0){
          //跳转到列表
          res.redirect("/user");
      }
    });
    });
});
//执行删除
app.get("/delete/:id.html",function(req,res){
    //获取参数
    var id=req.params.id;
    // console.log(id);
    // res.end('ok');
    //预处理
    sql="delete from stu where id=?";
    deletes=[id];
    //返回预处理
    sql=mysql.format(sql,deletes);
    //执行sql
    connection.query(sql, function (error, results, fields) {
      if (error) throw error;
      //判断受影响行数
      if(results.affectedRows>0){
          res.redirect("/user");
      }
    });
});
//执行修改
app.get("/update",function(req,res){
    //获取路径
    var url=req.url;
    //解析url //获取参数 id newV
    var params=urlTool.parse(url,true).query;
    // console.log(params);
    //执行sql语句 update stu set name=newV where id=id
    connection.query('update stu set name="'+params.newV+'" where id="'+params.id+'"', function (error, results, fields) {
      if (error) throw error;
      if(results.affectedRows>0){
          //以json格式返回
        res.json({'msg':'ok','status':1});
      }else{
          res.json({'msg':'error','status':0});
      }
    });
});
//监听的端口
app.listen(8080);

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>列表</title>
    <link rel="stylesheet" type="text/css" href="/bootstrap/dist/css/bootstrap.min.css">
    <script type="text/javascript" src="/jquery/dist/jquery.min.js"></script>
</head>
<body>
    <a href="" class="btn btn-success">查看信息</a>|<a href="/add" class="btn btn-success">添加信息</a>
    <hr>
    <table class="table table-bordered table-hover">
        <tr>
            <th>ID</th>
            <th>用户名</th>
            <th>密码</th>
            <th>操作</th>
        </tr>
        <%for(var i=0;i<users.length;i++){%>
            <tr>
                <td><%=users[i].id%></td>
                <td class="username"><%=users[i].name%></td>
                <td><%=users[i].pass%></td>
                <td><a href="/delete/<%=users[i].id%>.html" class="btn btn-info">删除</a></td>
            </tr>
        <%}%>
        
    </table>
</body>
<script type="text/javascript">
    var flag=false;
    // alert($);
    $(".username").dblclick(function(){
        if(flag) return ;
        flag=true;
        //获取需要修改的值
        p=$(this).html();
        // alert(p);
        //插入input
        input=$('<input type="text"  class="form-control"/>');
        //设置value值
        input.val(p);
        $(this).empty();//== innerHTML=null
        //内部插入
        $(this).append(input);
        var td=$(this);
        //失去焦点
        input.blur(function(){
            //获取修改以后的值
            newV=$(this).val();
            //获取id
            id=$(this).parents("tr").find("td:first").html();
            // alert(newV+":"+id);
            //Ajax
            $.get("/update",{newV:newV,id:id},function(data){
                // alert(data.msg);
                if(data.status==1){
                    alert("修改成功");
                    td.html(newV);
                }else{
                    alert("修改失败");
                }
            },'json');
            flag=false;
        });
        
    })
</script>
</html>

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>添加</title>
    <link rel="stylesheet" type="text/css" href="/bootstrap/dist/css/bootstrap.min.css">
</head>
<body>
    <button class="btn btn-success">用户添加</button>
    <form action="/insert" method="post">
        <div class="form-group">
            <label>用户名:</label>
            <input type="text" name="name" class="form-control">
        </div>
        <div class="form-group">
            <label>密码:</label>
            <input type="text" name="pass" class="form-control">
        </div>
        <input type="submit" value="提交" class="btn btn-info">
    </form>
</body>
<script type="text/javascript">
</script>
</html>
3.socketio 介绍
-------------------
1.express 设置cookie
res.cookie('cookie名字', '值', { maxAge: 900000, httpOnly: true })
maxAge 过期时间(单位为毫秒)  httpOnly 只能在请求头里设置cookie
2.cookie 检测
(1)安装cookie-parser
(2)引入cookie-parser
var cookieParser=require('cookie-parser');
(3)app.use(cookieParser())
(4) req.cookies.cookie的名字
3.遍历数据
加载模板和分配数据
res.render('模板',{user:数据值})
数据的遍历
<%for(var i=0;i<user.length;i++){%>
    <%=user[i].name%>
<%}%>
4.sql预处理
  (1)准备sql
  sql="insert into stu values(?????)";
  (2)绑定值
  inserts=[值];
  (3)返回预处理
  mysql.format(sql,inserts);
5.node js 返回的json格式的响应数据
res.json({msg:'ok'});

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多