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'});
|
|