node+express+mongodb初体验

　　从去年11月份到现在，一直想去学习nodejs，在这段时间体验了gulp、grunt、yeomen，fis，但是对于nodejs深入的去学习，去开发项目总是断断续续。

　　今天花了一天的时间，去了解整理整个学习思路，以下是我的学习分享，是入门级学习体验适合node+mongodb开发小白，node已玩过很久的大神这篇文章可能不适合。

　　开篇来个例子：

　　客户端表单页面：

<!DOCTYPE HTML>

<html lang="en-US">

<head>

    <meta charset="UTF-8">

    <title>表单页面</title>

</head>

<body>

    <form action="http://localhost:3000/" method ="post">

        <input type="text" name="title"/>

        <textarea name="text" id="" cols="" rows=""></textarea>

        <input type="submit" />

    </form>

</body>

</html>

　　服务器的页面(注意通过http.createServer创建的服务端，只支持post提交，get提交不行，get是取url)：

var http = require("http");  //注意require 引入的是module里面的模块可以不用加../ ./ ../../这种相对符，其他如果是同级也得加./才能引入成功

var open = require("child_process");

var querystring = require("querystring");

var server = http.createServer(function(req,res){

    var post = '';

    req.on('data',function(chunk){

        post += chunk;

    });

    req.on('end',function(){

        post = querystring.parse(post);

        res.writeHead(,{"Content-Type":"text/html;charset=UTF-8"});

        res.write(post.title);

        res.write(post.text);

        res.end();

    });

}).listen(,'127.0.0.1');

open.exec("start http://127.0.0.1:3000");

　　这个一个简单的例子，我们实现前台表单提交，后台获取数据。

　　通过这个简单的例子，我们可能想要做更复杂的的项目，那我们该如何下手呢，node+express+mongodb：

　　第一部分，基本知识点概要

　　express--一个简洁而灵活的 node.js Web应用框架

　　mongodb--适合node的关系型数据库

　　Mongoose -- Mongoose是MongoDB的一个对象模型工具，既类似ORM，让NodeJS更容易操作Mongodb数据库，Mongoose文档

　　node模版引擎--ejs，jade node模版引擎的深入探讨

　　Web 模板 Jade、EJS、Handlebars 万行代码解释效率比较，Jade 完败 https://cnodejs.org/topic/50e70edfa7e6c6171a1d70fa

　　EJS --http://www.embeddedjs.com/ github文档 -- https://github.com/tj/ejs

　　Jade —— 源于 Node.js 的 HTML 模板引擎 http://segmentfault.com/a/1190000000357534

　　JadeAPI --- http://www.nodeclass.com/api/jade.html#doctype

　　mongodb --- http://docs.mongodb.org/manual/ 手册

　　MongoDB介绍及安装 -- http://www.cnblogs.com/lipan/archive/2011/03/08/1966463.html

　　什么是MongoDB ? --- http://www.w3cschool.cc/mongodb/mongodb-intro.html

　　Express （ http://expressjs.com/ ）除了为 http 模块提供了更高层的接口外，还实现了
　　　　许多功能，其中包括：
　　　　 路由控制；
　　　　 模板解析支持；
　　　　 动态视图；
　　　　 用户会话；
　　　　 CSRF 保护；
　　　　 静态文件服务；
　　　　 错误控制器；
　　　　 访问日志；
　　　　 缓存；
　　　　 插件支持。

　　 Express 提供了路由控制权转移的方法，即回调函数的第三个参数next，通过调用next()，会将路由控制权转移给后面的规则。

　　这里重点分析一下ejs模板引擎，因为以后的项目了，可能我将大多用ejs，因为它十分简单，而且与 Express 集成良好。由于它是标准 JavaScript 实现的，因此它不仅可以运行在服务器端，还可以运行在浏览器中。

　　我们在 app.js 中通过以下两个语句设置了模板引擎和页面模板的位置：

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

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

　　如何将ejs模版引擎的后缀.ejs设置为.html

// 定义EJS模板引擎和模板文件位置，也可以使用jade或其他模型引擎

app.set("views",path.join(__dirname,'ejviews'));

//注册html模板引擎 将模版页后缀换成.html

app.engine('.html',ejs.__express);

//将模板引擎换成html

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

　　ejs 的标签系统非常简单，它只有以下3种标签。

　　 <% code %>：JavaScript 代码。
　　 <%= code %>：显示替换过 HTML 特殊字符的内容。
　　 <%- code %>：显示原始 HTML 内容。
　　我们可以用它们实现页面模板系统能实现的任何内容。

　　注意：由于新版本不支持layout.ejs，解决方案

　　安装模块express-partials

　　var partials = require('express-partials');

　　app.use(partials());

　　可以在layout里面设置指定layout层

　　app.get('/',function(req,res){

　　res.render('index',{title:'imooc home',name:"pfan",content:"大家好，我来自火星，我的任务是奋斗！",layout:"layout"});

　　　　res.send('The time is ' + new Date().toString());

　　});

在 app.js 的中 app.configure 中添加以下内容，这样页面布局功能就被关闭了。

app.set('view options', {

layout: false

});

　或者用第二种方案:上传代码例子

　　index.html文件代码:

<% include header.html %>

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

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

<div class="red_txt">

    <%= content %>

</div>

<% include footer.html %>

　　header.html代码:

<!DOCTYPE html>

<html>

<head>

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

<meta charset="UTF-8">

<meta name="keywords" content="express">

<meta name="description" content="express">

<meta name="author" content="pingfan">

<link rel='stylesheet' href='/stylesheets/style.css' />

</head>

<body>

　　footer.html代码:

<link rel='stylesheet' href='/javascripts/fastclick.js' />

</body>

</html>

　　　第二部分，配置开发安装包

　　　① 配置package.json --- npm init初始配置package包依赖

{

  "name": "pfan",

  "version": "1.0.1",

  "description": "pfan",

  "main": "app.js",

  "dependencies": {

    "express": "^4.12.4",

    "jade": "^1.10.0",

    "mongoose": "^4.0.3"

  },

  "devDependencies": {

    "body-parser": "^1.12.4"

  },

  "scripts": {

    "test": "echo \"Error: no test specified\" && exit 1"

  },

  "author": "",

  "license": "ISC"

}

　　这里注意：其实配置package.json非常重要，我们写好所需的依赖模块，然后通过 npm install 就可以将参数里面的依赖一起进行安装，这里其实，我们可以在安装 npm install express generator 生成node项目的目录结构和依赖模块的package.json　

　　　②快速建立web mvc 目录结构

　　　　Express是一个轻量级、简洁、易用的Node.js Web MVC开发框架
　　　　全局安装，可以快速建立目录结构web mvc目录结构

npm install -g express-generator

　　创建 express webmvc目录结构项目

express devexpress

　　　　③安装node module包依赖npm install express

npm install express              //web应用框架

npm install jade              //模版引擎

npm install ejs                  //模版引擎

npm install mongoose          //MongoDB的一个对象模型工具，操作更简单

npm install mongodb          //MongoDB的驱动

npm install serve-favicon     //统一设置网站icon

npm install morgan               //HTTP 请求日志中间件

npm install cookie-parser               //cookie解析器

npm install body-parser               //定义数据解析器

npm install bower -g

bower install bootstrap

　　　　注意：提出一个问题，就是我们在命令窗口，执行npm install 会执行package.json里面的包依赖，则我们通过express 项目名称这样去执行，之后在通过npm install 就可以了执行项目案例里面的依赖，从而安装整个项目框架

　　　　⑤启动express项目

npm start    //貌似现在的项目变成这样启动了

　　　　简单的路由相关方面案例:

var express = require("express");

var app = express();

var open = require("child_process");

var path = require('path');

var port = process.env.PORT || ;

//新增

var server = app.listen(,function(){

    console.log("listening on port %d",server.address().port);

});

//设置引擎

app.set("views","./views");

app.set("view engine","jade");

//设置样式路径

app.use(express.static(path.join(__dirname, 'public')));

console.log(path.join(__dirname, 'public'));

//设置路由

app.get('/',function(req,res){

    res.render('index',{title:'imooc home',content:"I am welcome  you"});

});

app.get('/users:22',function(req,res){

    res.render('users',{title:'imooc details'});

});

open.exec("start http://127.0.0.1:3000")

　　　　第三部分，mongodb的坑 ---mongodb文档（有些老旧的api以作更改）

　　　1.安装

　　　　首先，安装mongodb,直接解压安装，这里不再赘述。

　　　　下面，我们来讲mongodb和node连接起来，在工程文件夹webapp下新建data用来存放数据

　　　　启动mongodb服务器访问http://localhost:27017判断是否开启成功

cd  D:\Program Files\mongodb\bin  //进入到mongodb 中bin文件下

mongod  -- dbpath  "D:\Program Files\mongodb\data"    //关联新建的data文件来存放数据

解释：

mongod      : 启动程序命令

--dbpath     : 的数据库存放路径

--logpath     : 的日志文件路径

--logappend : 以追加方式，写日志文件

--auth      : 是否进行用户认证，加上后,MongoDB会使用用户认证方式登录。

--port      : 端口号，可以自定义，默认

--fork      : 服务是否以后台运行的方式运行

--bind_ip    : 限制特定IP地址访问

　　　　关联项目

cd node/webapp

mkdir data   //新建data文件用来存放数据

　　　　出现这样的结果，说明连接mongodb成功了！

、

　　　　2.创建数据库

　　　　进入mongodb的安装目录D:\Program Files\mongodb\bin，敲命令mongo，切换数据库webapp

cd  D:\Program Files\mongodb\bin  //进入目录

mongo           //执行mongo

use  webapp    //使用webapp数据库，切换数据库

　　　　插入一个usercollection表，执行：

db.usercollection.insert({ "username" : "testuser1", "email" : "testuser1@testdomain.com" })

　　　　执行，查看插入的数据，是否成功

db.usercollection.find().pretty()   //查看插入的数据，是否成功

　　　　3.给数据库配置用户名和密码

cd  D:\Program Files\mongodb\bin  //进入目录

mongo           //执行mongo

use  webapp    //使用webapp数据库，切换数据库

db.createUser({createUser:"test",pwd:"test",roles:[{role:"dbOwner",db:"webapp"}]})  //设置用户名密码，老版本用的是db.addUser注意

show users   //webapp现在已存在的用户

　　安装mongodb还会有很多的坑，我也没有找到好的解决方案，给大家提供一些好的mongodb参考资料:

　　Node.js与MongoDB在Windows环境下的安装 https://cnodejs.org/topic/524040e9101e574521760713　

　　MongoDB在windows下安装配置 http://www.cnblogs.com/lsc183/archive/2012/08/16/mongodb.html

　　MongoDB 学习笔记 - 1、如何将MongoDB做一项Windows服务启动　http://www.cnblogs.com/sslshopper/archive/2012/11/26/2789241.html

　 Nodejs学习笔记（十）--- 与MongoDB的交互（mongodb/node-mongodb-native）、MongoDB入门 http://www.cnblogs.com/zhongweiv/p/node_mongodb.html

　　注意一个问题：我们在操作mongodb时，可能很多时候通过安装模块 npm install mongodb 驱动模版，或者npm install mongoose 通常来说mongoose 更好用，但是我们在先装了mongodb驱动之后，会导致mongoose安装出错，解决办法:

　　错误图片：

npm unistall mongodb

npm cache clean

npm install

安装成功图片:

　　注意一个问题：可能我们在运行的时候经常遇到乱码的情况，这里给大家几种解决方案

　　1.检查所有的js和html文件以及引擎模版都用UTF-8编码保存

　　2.设置res.writeHead(200,{"Content-Type":"text/html;charset=UTF-8"});或者res.header("Content-Type", "application/json; charset=utf-8");

使用mongoose和mongoodb时遇到的问题(解决办法)：

　　当我们使用mongoose操作mongodb时，会遇到如下问题（非常头痛）：

　　解决办法如下：

　　其实我们只需要找到\node_modules\mongoose\node_modules\bson\node_modules\bson-ext\ext文件下的index.js文件：

　　我们只需要将路径改为指定的bson模块即可，简单粗暴的方法：

　　安装 bson npm install bson

　　将其路径改为 bson = require('bson');

mongoodb模块下参照http://www.tuicool.com/articles/NNbiYr

　　注意问题：

　　使用mongoose和mongoodb时遇到的问题：

　　http://www.cnblogs.com/scaleworld/p/4314742.html#3195147

　　http://blog.csdn.net/sanjay_f/article/details/44941077

　　这里讲一个我认为的express与http.createServer之间容易产生的一个误区（以下是express3.0的创建服务器的写法）：

var express = require('express'), //引入express模块

    app = express(),

    server = require('http').createServer(app);

app.use('/', express.static(__dirname + '/www')); //指定静态HTML文件的位置

server.listen();

　　但其实我们用http模块创建服务器：

var  http = require("http"),

      fs = require("fs"),

      url = require("url") , //解析请求url

      querystring = require("querystring") //获取hash值;

var server = http.createServer(function(req,res){

      var  url = url.parse(req.url);

       var data = fs.readFileSync(url,"uth-8");

    res.writeHead(, {

        "Content-Type": "text/html;charset=UTF-8"

    });

       res.write(data);

       res.end();

}).listen(,function(){console.log("服务器已经开始监听3000端口")});

　　两者对比，其实express也只有一个server的实例，然后app.use,app.get,app.set，等都是express里面的回调方法而实现服务器将数据返还给客户端而已。

　　最后资源分享：

　　express例子：https://github.com/pingfanren/express

　　express与数据库的例子：https://github.com/pingfanren/expressSimpleBlog

　　博文：http://www.cnblogs.com/myzhibie/

　　express例子：https://github.com/nswbmw/N-blog/wiki/_pages

　　叶小钗博文：http://www.cnblogs.com/yexiaochai/p/3527418.html

　　nodejs教程（很全面的课程）：https://github.com/alsotang/node-lessons

　　NodeJS实战：Express+Mongoose+ejs : http://www.cnblogs.com/highsea90/p/4308794.html

　　MongoDB的应用：http://javascript.ruanyifeng.com/nodejs/mongodb.html

　　node错误问题汇总：

　　http://www.cnblogs.com/liuswi/p/4030216.html

node+express+mongodb初体验的更多相关文章

Node+Express+MongoDB + Socket.io搭建实时聊天应用
Node+Express+MongoDB + Socket.io搭建实时聊天应用前言本来开始写博客的时候只是想写一下关于MongoDB的使用总结的,后来觉得还不如干脆写一个node项目实战教程实战 ...
Node+Express+MongoDB + Socket.io搭建实时聊天应用实战教程(二)--node解析与环境搭建
前言本来开始写博客的时候只是想写一下关于MongoDB的使用总结的,后来觉得还不如干脆写一个node项目实战教程实战.写教程一方面在自己写的过程中需要考虑更多的东西,另一方面希望能对node入门者有 ...
基于react全家桶+antd-design+webpack2+node+express+mongodb开发的前后台博客系统
很久没更新博客,最近也有点忙,然后业余时间搞了一个比较完整基于react全家桶+antd-design+webpack2+node+express+mongodb开发的前后台博客系统的流程系统,希望对 ...
Node+Express+MongoDB+Socket.io搭建实时聊天应用实战教程(一)--MongoDB入门
前言本文并不是网上流传的多少天学会MongoDB那种全面的教程,而意在总结这几天使用MongoDB的心得,给出一个完整的Node+Express+MongoDB+Socket.io搭建实时聊天应用实 ...
使用node+express+mongodb实现用户注册、登录和验证功能
无论是手机端还是pc端,几乎都包含登录注册方面功能,今天就使用node+express+mongodb实现一套登录注册功能,这里需要自己去安装MongoDB环境,如果没有安装可以看这篇关于MongoD ...
搭建简单的node+express+mongodb项目
安装首先要确保已经安装了 Node.js,接下来创建一个目录,然后进入此目录并将其作为当前工作目录. mkdir myapp cd myapp 通过 npm init 命令为应用创建一个 packa ...
Node.js 安装初体验(1)
1.安装nodejs http://nodejs.org/download/ 自动根据系统下载自己的版本node.js 2.环境变量 windows 安装,不需要配置环境变量 mac安装后,会提 ...
Node爬虫之初体验
记得之前就听说过爬虫,个人初步理解就是从网页中抓取一些有用的数据,存储到本地,今天就当是小牛试刀,拿来溜溜...... 实现需求: 抓取课程数据,输入url后并在浏览器端以一定的数据格式显示出来(如下 ...
Node+Express+MongoDB + Socket.io搭建实时聊天应用实战教程(三)--前后端环境配置
前言之前都是介绍一些基础知识,在这一节,我们就要开始实战coding了.正所谓磨刀不误砍柴工,准备工作显得尤为重要.很多demo只是追求效果的实现,并不注重整个demo的架构性.从我个人的角度看来, ...

随机推荐

Vim中自动在程序起始处添加版权和作者信息
在编写程序的时候,经常需要在程序开始写上程序的简要介绍和作者信息,如下: 这种信息,除了文件名和修改时间可能经常发生变化外,其他基本不变,可以在程序开始自动加入,方法就是在家目录下的.vimrc中写入 ...
Python中__repr__和__str__区别
Python中__repr__和__str__区别看下面的例子就明白了 class Test(object): def __init__(self, value='hello, world!'): ...
Linux下clock计时函数学习
平时在Linux和Winows下都有编码的时候,移植代码的时候免不了发现一些问题.1. 你到底准不准?关于clock()计时函数首先是一段简单的测试代码,功能为测试从文本文件读取数据并赋值给向量最后打 ...
【bzoj1901】dynamic ranking（带修改主席树）
传送门(权限) 传送门(非权限) 花了一晚上总算把代码调好了……才知道待修改主席树怎么操作…… 然而还是一知半解orz…… 先说说我的理解吧我们一般建主席树的时候都是直接在序列上建的但是如果有修改 ...
client模式下对应接口加入桥接出错
client模式下,响应的接口wlan0 加入桥接时出现如下错误: root@root:~# brctl addif br-lan wlan0brctl: bridge br-lan: Operati ...
来自工程师的8项Web性能提升建议
在互联网盛行的今天,越来越多的在线用户希望得到安全可靠并且快速的访问体验.针对Web网页过于膨胀以及第三脚本蚕食流量等问题,Radware向网站运营人员提出以下改进建议,帮助他们为用户提供最快最优质的 ...
如何理解深度学习中的Transposed Convolution？
知乎上的讨论:https://www.zhihu.com/question/43609045?sort=created 不过看的云里雾里,越看越糊涂. 直到看到了这个:http://deeplearn ...
C++ code：判断字符串相等
如果两个字符串中0和1的个数分别相等,则称该对字符串为相等. 方法一: 由于string类对于读取文件中子串以及比较都很方便,所以,用string类的对象来逐对存放字串,然后将字串分别排序后对其进行比 ...
python+selenium十二：一个输入框双层input标签
先点击第一个,再对第二个进行操作,否则操作失败 driver.find_element_by_css_selector(".pwd").click()driver.find_ele ...
python 全栈开发，Day98(路飞学城背景,django ContentType组件,表结构讲解)
昨日内容回顾 1. 为什么要做前后端分离? - 前后端交给不同的人来编写,职责划分明确. - API (IOS,安卓,PC,微信小程序...) - vue.js等框架编写前端时,会比之前写jQuery ...

node+express+mongodb初体验

node+express+mongodb初体验的更多相关文章

随机推荐

热门专题