接触NodeJs的一周

什么是nodejs?

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型。
Node 是一个让 JavaScript 运行在服务端的开发平台,它让 JavaScript 成为与PHP、Python、Perl、Ruby 等服务端语言平起平坐的脚本语言。发布于2009年5月,由Ryan Dahl开发,实质是对Chrome V8引擎进行了封装。
Node对一些特殊用例进行优化,提供替代的API,使得V8在非浏览器环境下运行得更好。V8引擎执行Javascript的速度非常快,性能非常好。Node是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node 使用事件驱动, 非阻塞I/O 模型而得以轻量和高效,非常适合在分布式设备上运行数据密集型的实时应用。

nodejs核心模块 — url

控制台输入node指令
-url.parse(str[,bool])可以将地址解析成对象

如果只有第一个参数:

url.parse('http://localhost:3000/api?course=node&class=1902#url')

控制台输出为:

Url { 
protocol: 'http:', // 协议 
slashes: true,
auth: null, 
host: 'localhost:3000', // 域名 + 端口 
port: '3000', // 端口号 
hostname: 'localhost', // 域名 
hash: '#url', // 哈希值 
search: '?course=node&class=1902', // ? + 参数 
query: 'course=node&class=1902', // 字符串形式的参数 
pathname: '/api', // 路由 --- 标识的是哪一个页面或者哪一个接口 
path: '/api?course=node&class=1902', // 路由 + search 
href: 'http://localhost:3000/api?course=node&class=1902#url' }

如果有第二个参数,并且值为true时:

url.parse('http://localhost:3000/api?course=node&class=1902#url', true)

控制台输出为:

Url { 
protocol: 'http:', 
slashes: true, 
auth: null, 
host: 'localhost:3000', 
port: '3000', 
hostname: 'localhost', 
hash: '#url', 
search: '?course=node&class=1902', 
query: { course: 'node', class: '1902' }, // ***************** 
pathname: '/api', 
path: '/api?course=node&class=1902', 
href: 'http://localhost:3000/api?course=node&class=1902#url' }

还学习了URL模块结和nodejs服务器的使用:

  • url.parse(req.url, true).query获取到参数信息

  • url.parse(req.url, true).pathname获取到路由信息

  • url.parse(req.url, true).port获取到端口号

  • url.parse(req.url, true).protocol获取到协议信息

  • url.parse(req.url, true).hostname获取到域名信息

nodejs核心模块querystring

querystring.parse(str)可以将字符串形式的参数解析成对象

以及querystring模块结合nodejs服务器的使用

前后端分离与耦合构架的概念

前后端分离

前端HTML页面通过Ajax调用后端的RestFul API并使用Json数据进行交互

在这里插入图片描述
前后端耦合

前端写完的HTML页面交给后端,后端负责渲染数据,前后端相互调整的方式

在这里插入图片描述

nodejs学习过程

1.如何使用express来创建服务器:
利用终端安装express模块,再利用相应的命令来实现服务器的创建
安装express生成器,通过应用生成器工具 express-generator 可以快速创建一个应用的骨架
利用命令生成项目

2.静态文件资源托管(static)
为了提供诸如图像、CSS 文件和 JavaScript 文件之类的静态文件,请使用 Express 中的 express.static 内置中间件函数。

3.路由
路由是指确定应用程序如何响应对特定端点的客户端请求,该请求是URI(或路径)和特定HTTP请求方法(GET,POST等)。每个路由都可以有一个或多个处理函数,这些函数在路由匹配时执行。

4.中间件
中间件函数是可以访问请求对象 (req),响应对象(res)以及next应用程序请求 - 响应周期中的函数的函数。该next功能是Express路由器中的一个功能,当被调用时,它将执行当前中间件之后的中间件。
可以使用 app.use() 调用中间件

5.ejs模板的使用
EJS 是一套简单的模板语言,帮你利用普通的 JavaScript 代码生成 HTML 页面。EJS 没有如何组织内容的教条;也没有再造一套迭代和控制流语法;有的只是普通的 JavaScript 代码而已。

  • 前端ejs模板中使用变量
<%- title %> // 解析 
<%= title %> // 转义 --- 原样输出
  • 导入代码片段
<%- include('./header.ejs') %>
  • 条件判断
<% if (!flag) { %> 
	<ul> 
		<li>week1</li>
	</ul> 
<% } %>
  • 循环语句
<% for (var i = 0; i < list.length; i++) { %>
    <p><%- list[i] %></p>
<% } %>

6.mongodb的使用:
mongodb是一个基于分布式文件存储的数据库
命令行操作MongoDB
D盘mongodb文件夹内解压下载好的mongodb文件

D盘根目录下创建一个文件夹data,在data内部再创建一个文件夹db

进入到mongodb的bin目录

按住shift,点击鼠标的右键,打开命令行窗口,输入如下指令打开数据库连接池

mongod --dbpath d:\data\db

再在此目录中,按住shift,点击鼠标的右键,打开命令行窗口,输入如下指令打开一个连接数据库的客户端,不要关闭上一个窗口

mongo
数据库常用命令

查询数据库

show dbs

删除数据库

db.dropDatabase()
collection 聚集集合操作

创建集合

db.createCollection(name, options)
db.createCollection("collName", {size: 20, capped: true, max: 100});

document文档操作
插入文档

db.collection.insertOne(document) // 向指定集合中插入一条文档数据 
db.collection.insertMany(document) // 向指定集合中插入多条文档数据

查询数据

db.find() 
db.find().pretty()  // 使用 pretty() 方法以格式化的方式来显示所有文档

删除数据

db.users.deleteOne()	// 删除一条数据
db.users.deleteMany()	// 删除多条数据

修改数据

db.users.updateOne()	// 修改一条数据
db.users.updateMany()	// 修改多条数据

查询数据显示字段

db.users.find({条件},{字段名})
nodejs结合mongodb

首先需要安装mongoose
然后再连接数据库
再设计用户数据表,暴露数据模型,并且在数据库中创建了集合

1.封装数据库模块
module.exports = {
  // 增
  insert (insertData) {  
    insertData.save(err => {
      if (err) throw err;
      console.log('insert success');
    })
  },
  // 删
  delete: (col, type, deleteData) => {
    col[type](deleteData, err => {
      if (err) throw err;
      console.log('delete success');
    })
  },
  // 改
  update: function (col, type, whereObj, updateObj) {
    col[type](whereObj, updateObj, err => {
      if (err) throw err;
      console.log('update success');
    })
  },
  // 查
  find (col, whereObj, showObj) {
    col.find(whereObj, showObj).exec((err, data) => {
      if (err) throw err;
      console.log(data);
    })
  },
  // 排序
  sort (col, whereObj, showObj, sortObj) {
    col.find(whereObj, showObj).sort(sortObj).exec((err, data) => {
      if (err) throw err;
      console.log(data);
    })
  }
}

回调函数解决异步数据问题
在每一个函数后边再新添加一个参数callback

insert (inserData, callback) {
    insertData.save(err => {
        if (err) throw err;
        callback();
    })
}

sql.insert(user, () => {console.log(''insert success)})

promise解决异步数据问题

insert (inserData) {
    return new Promise((resolve, reject) => {
        insertData.save(err => {
            if (err) throw err;
            resolve();
        })
    })
}

sql.insert(user).then(() => {console.log(''insert success)})

后台管理系统

下载admin-lte模板
安装第三方模块

cnpm i supervisor -g (只需要装一次)

安装成功之后就不需要每次修改nodejs代码都重新启动服务器了,更加便捷我们的使用

admin-lte的模板结合express
1.复制结构
2.添加样式
3.处理js
4.分割页面取出共同的部分
5.页面通过路由使用

var express = require('express');
var router = express.Router();
router.get('/', function(req, res, next) {
    res.render('user'); // 此处user为关键词
});
module.exports = router;

6.让路由生效
7.添加数据表格

学习后台管理系统就是为了让我们更方便的去使用它
当然还有后台管理系统的增删改查操作,如何添加数据,删除数据,修改数据,查询数据

导入数据
安装node-xlsx模块
导入数据并且插入数据库

**后台管理系统的登录功能
创建一个新的ejs文件,然后实现一个跳转到登录的路由,
再利用bcrypt实现数据的实时加密,最后还需要验证是不是登录状态,用cookie和session分别存储状态,也大致了解了一下token

接口

接口规范

  • 接口名称
  • 场景说明
  • 接口说明
  • 请求参数
  • 响应参数
  • 错误码

参数内容

  • 字段名
  • 变量名
  • 是否必填
  • 类型
  • 示例值
  • 描述

错误码内容

  • 名称
  • 描述
  • 原因
  • 解决方案

postman接口调试工具的使用
用户在开发或者调试网络程序或者是网页B/S模式的程序的时候是需要一些方法来跟踪网页请求的,用户可以使用一些网络的监视工具比如著名的Firebug等网页调试工具。

接口的编写
前后端分离:res.send()
前后端不分离:res.render()
前端利用ajax调用接口,遇到跨域问题,可以使用jsonp和cors来解决,还可以使用服务器代理,但一般推荐使用cors来解决,代码量比较少

文件上传
初始上传发现没有后缀名,需后面把 mimetype 字段的 png 提取出来,然后与文件名组合,就可以显示这张图片
其实就是更改文件名称的功能

SSR
SSR是 Server-Side Rendering(服务器端渲染)的缩写,在普通的SPA中,一般是将框架及网站页面代码发送到浏览器,然后在浏览器中生成和操作DOM(这里也是第一次访问SPA网站在同等带宽及网络延迟下比传统的在后端生成HTML发送到浏览器要更慢的主要原因),但其实也可以将SPA应用打包到服务器上,在服务器上渲染出HTML,发送到浏览器,这样的HTML页面还不具备交互能力,所以还需要与SPA框架配合,在浏览器上“混合”成可交互的应用程序。所以,只要能合理地运用SSR技术,不仅能一定程度上解决首屏慢的问题,还能获得更好的SEO。

SSR的优点:

  • 更快的响应时间,不用等待所有的JS都下载完成,浏览器便能显示比较完整的页面了。
  • 更好的SSR,我们可以将SEO的关键信息直接在后台就渲染成HTML,而保证搜索引擎的爬虫都能爬取到关键数据。

SSR的缺点

  • 相对于仅仅需要提供静态文件的服务器,SSR中使用的渲染程序自然会占用更多的CPU和内存资源
  • 一些常用的浏览器API可能无法正常使用,比如windowdocmentalert等,如果使用的话需要对运行的环境加以判断
  • 开发调试会有一些麻烦,因为涉及了浏览器及服务器,对于SPA的一些组件的生命周期的管理会变得复杂
  • 可能会由于某些因素导致服务器端渲染的结果与浏览器端的结果不一致。

SSR常用框架

  • React的Next
  • Vue.js的Nuxt
SEO的优化

通过网站的结构布局设计和网页代码优化,使前端页面既能让浏览器用户能够看懂,也能让“蜘蛛”看懂。

Socket通讯

socket 网络传输 — 双向数据传输

Socket简介和通讯流程
网络上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端称为一个socket。

建立网络通信连接至少要一对端口号(socket)。socket本质是编程接口(API),对TCP/IP的封装,TCP/IP也要提供可供程序员做网络开发所用的接口,这就是Socket编程接口;HTTP是轿车,提供了封装或者显示数据的具体形式;Socket是发动机,提供了网络通信的能力。

  • 8
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值