zoukankan      html  css  js  c++  java
  • 使用nodejs进行WEB开发

    这里,准备从零开始用nodejs实现一个微博系统。功能包括路由控制、页面模板、数据库访问、用户注册、登录、用户会话等内容。

    将会介绍Express框架、MVC设计模式、ejs模板引擎以及MongoDB数据库的操作。

    准备工作

     使用http模块,Express框架,

     nodejs的抽象如此之差,把不该有的细节暴露给开发者。你可以用它做任何HTTP服务器能做的事情,不仅仅是做一个网站,甚至实现一个HTTP代理服务器都行。

    Express是WEB开发框架。

    实现:

    为HTTP模块提供了更高层的接口,

    路由控制,

    模板解析支持,

    动态视图,

    用户会话,

    CSRF保护,

    静态文件服务,

    错误控制器,

    访问日志,

    缓存,

    插件支持。

    多数功能只是对HTTP协议中常用操作的封装,更多的功能需要插件或者整合其他模块来完成。

    快速开发

    安装Express

    在项目目录下

    npm install -g express-generator

    express --help

    建立工程

    express -t ejs microblog 由于新版本没有-t命令

     1.如何在项目中安装ejs模板引擎

    在NodeJS指南中利用利用以下命令建立网站的基本结构:

    express -t ejs microblog

    运行这个命令后继续运行

    cd microblog && npm install(安装项目的依赖属性),

    发现安装的模板引擎是jade,而不是ejs。原因是现在的版本已经没有-t这个命令了,改为

    express -e  microblog

    运行完这个命令,继续运行cd microblog && npm install,ejs模板引擎就安装好了

    但是express3以上的版本把layout默认给取消了,所以现在在views文件夹下并没有生成layout.ejs。

    2.安装了ejs后,如何使用ejs的layout模板 

       安装express-partials

        在cmd中切换到项目目录,运行

    (1)npm install express-partials或者

    (2)在 package.json 里面的 dependencies 添加 "express-partials": "*"。然后在项目目录下运行 npm install

    (3)然后在app.js 里面引用 express-partials,引用方法:

       1.在path = require('path')后,添加引用 var partials = require('express-partials');

       2.在 app.set('view engine', 'ejs')后,添加 app.use(partials());

     3.增长端口,

      app.listen(8100,function(){
          console.log("Server Start!");
      });

    http://cnodejs.org/topic/515b009a6d38277306192e4e

    启动服务器

    http://localhost:8100

    工程的结构

    package.json

    js文件: app.js, routes/index.js

    模板引擎ejs也有2个文件index.ejs, layout.ejs

    style.css

    路由控制

    工作原理

    浏览器会向服务器发送请求,

    app.js有一行app.get('/',routes.index),规定路径"/"的GET请求由routes.index函数处理。

    最终视图模板生成HTML页面,返回给浏览器,

    浏览器发现要获取style.css会再次向服务器发起请求,app.use()配置了静态文件服务器,找到文件,向客户端返回信息。

    MVC架构,浏览器发起请求,由路由控制器接受,根据不同的路径定向到不同的控制器。

    创建路由规则

    app.get('/hello', routes.hello);

    app.get是路由规则创建函数,接受2个参数,一个是请求的路径,一个是回调函数。

    路径匹配

    REST风格的路由规则

    REST表征状态转移

    GET       app.get(path, callback);

    POST     app.post(path, callback);

    PUT       app.put(path, callback);

    DELETE app.delete(path, callback);

    控制权转移

    同一路径绑定多个路由响应函数,

    通过调用next(),会将路由控制权转移给后面的规则。

    模板引擎

    什么是模板引擎

    是一个从页面模板根据一定的规则生成HTML的工具。

    功能是将页面模板和要显示的数据结合起来生成HTML页面。目前的主流还是由服务器运行模板引擎。

    使用模板引擎

    推荐使用ejs

    app.js中设置了模板引擎和页面模板的位置

    app.set('views', __dirname + '/views');

    app.set('view engine', 'ejs');

    调用模板routes/index.js

    res.render('index', {title:'Express'});

    模板文件index.ejs

    <h1><%=  title %></h1>

    <p>Welcome to <%= title %></p>

    页面布局

    layout.ejs

    片段视图

    partials接受2个参数,第一个是片段视图的名称,第二个是一个对象或一个数组。

    <%- partial('listitem', items)%>

    视图助手

    允许在视图中访问一个全局的函数或对象,不用每次调用视图解析的时候单独传入。partial就是视图助手。

    两类,静态(对象)和动态(函数,不接受参数,可以访问req res对象)。

    建立微博网站

    功能分析

    路由规划

    界面设计

    使用Bootstrap

    用户注册和登录

    访问数据库

      NoSQL非关系型数据库

      MongoDB对象数据库,没有表行等概念,没有固定的模式和结构。

          链接数据库

      (

      开启服务器

      

    C:Program Filesmongodbin

    > mongod.exe -dbpath "E:mongodbfiles"

    打开浏览器输入:http://127.0.0.1:27017/

    mongo.exe

    use cnblogs

    > db.users.insert({'name':'xumingxiang','sex':'man'})

    在shell 命令窗口键入如下命令:

    > show dbs // 显示所有数据库

    >show collections // 显示当前数据库下的所有集合

    >db.users.find() // 显示users集合下的所有数据文档

      

      )

    会话支持

    注册和登入

      注册页面

          注册响应

          用户模型

          视图交互

          登入和登出

    页面权限控制

    发表微博

  • 相关阅读:
    nopcommerce 电商商城 ASP.NET 开源系统
    Android 圆形/圆角图片的方法
    5 shell命令之tr
    破茧成蝶2:和产品经理一起做需求分析
    android中单元測试中的断言assert的使用与扩展
    位置与地图(二)地图的使用以及标注地图
    找与一个数二进制表示1的个数相同的相邻的两个数
    Hook linux 网络封包
    使用ant自动编译、打包生成apk文件
    Analyzing the Analyzers 分析分析师 —— 数据科学部门如何建
  • 原文地址:https://www.cnblogs.com/luyuan/p/3874644.html
Copyright © 2011-2022 走看看