js的应用为什么会越来越广泛呢!
node.js 使得javascript可以做后端开发成为了一种可能,这样可以使一些前端开发工程师成为全栈工程师成为了可能,并在各个行业强占后端市场。
1.1 网站的组成
网站应用程序主要分为两大部分:客户端和服务器端。
客户端:在浏览器中运行的部分,就是用户看到并与之交互的界面程序。使用HTML、CSS、JavaScript构建。
服务器端:在服务器中运行的部分,负责存储数据和处理应用逻辑。
1.2 Node 网站服务器
能够提供网站访问服务的机器就是网站服务器,它能够接收客户端的请求,能够对请求做出响应。
1.3 IP地址
互联网中设备的唯一标识。
IP是 Internet Protocol Address 的简写,代表互联网协议地址
这个相信大家都很熟悉,我就不贴图了
1.4 域名
由于IP地址难于记忆,所以产生了域名的概念,所谓域名就是平时上网所使用的网址。
虽然在地址栏中输入的是网址, 但是最终还是会将域名转换为ip 才能访问到指定的网站服务器
1.5 端口
使用端口区分不同的服务,它是一些具有一定范围的数字, 范围是0到65535, 每一个向外界提供服务的软件, 都要占用一个端口
1.6 URL
统一资源定位符,又叫URL(Uniform Resource Locator),是专为标识Internet网上资源位置而设的一种编址方式,我们平时所说的网页地址指的是URL。
URL的组成
传输协议://服务器IP或域名:端口/资源所在位置标识
http:超文本传输协议,提供了一种发布和接收HTML页面的方法。
今天主要分享的是服务端相关的知识。文末会有一个串联前后端的案例!
创建web服务器
// 引用系统模块
const http = require('http');
// 创建web服务器
const app = http.createServer();
// 当客户端发送请求的时候
app.on('request', (req, res) => {
// 响应
res.end('<h1>hi, user</h1>');
});
// 监听3000端口
app.listen(3000);
console.log('服务器已启动,监听3000端口,请访问 localhost:3000')
有了后端服务器,我们还要将前后端用某种方式联系起来!这种方式就是HTTP协议。
HTTP 协议
3.1 HTTP协议的概念
超文本传输协议(英文:HyperText Transfer Protocol,缩写:HTTP)规定了如何从网站服务器传输超文本到本地浏览器,它基于客户端服务器架构工作,是客户端(用户)和服务器端(网站)请求和应答的标准。
3.2 报文
在HTTP请求和响应的过程中传递的数据块就叫报文,包括要传送的数据和一些附加信息,并且要遵守规定好的格式。
报文分为两种,页面发送的请求报文和服务器接收后反馈的响应报文!
请求报文根据请求方式分为两种:
1,get请求数据。
参数被放置在浏览器地址栏中,例如:http://localhost:3000/?name=chencong&age=20
参数获取需要借助系统模块url,url模块用来处理url地址
const http = require('http');
// 导入url系统模块 用于处理url地址
const url = require('url');
const app = http.createServer();
app.on('request', (req, res) => {
// 将url路径的各个部分解析出来并返回对象
// true 代表将参数解析为对象格式
let {query} = url.parse(req.url, true);
console.log(query);
});
app.listen(3000);
2,post发送数据
参数被放置在请求体中进行传输
获取POST参数需要使用data事件和end事件
使用querystring系统模块将参数转换为对象格式
// 导入系统模块querystring 用于将HTTP参数转换为对象格式
const querystring = require('querystring');
app.on('request', (req, res) => {
let postData = '';
// 监听参数传输事件
req.on('data', (chunk) => postData += chunk;);
// 监听参数传输完毕事件
req.on('end', () => {
console.log(querystring.parse(postData));
});
});
同时还需要有请求地址(Request URL)
app.on('request', (req, res) => {
req.headers // 获取请求报文
req.url // 获取请求地址
req.method // 获取请求方法
});
响应报文
http状态码可粗略分为:
200 请求成功
404 请求的资源没有被找到
500 服务器端错误
400 客户端请求有语法错误
内容类型可以分为以下:
text/html
text/css
application/javascript
image/jpeg
application/json
app.on('request', (req, res) => {
// 设置响应报文
res.writeHead(200, {'Content-Type': 'text/html;charset=utf8‘
});
});
这种响应当然是需要一个中枢来操纵的,这个我们称为路由!
路由是指客户端请求地址与服务器端程序代码的对应关系。简单的说,就是请求什么响应什么
// 当客户端发来请求的时候
app.on('request', (req, res) => {
// 获取客户端的请求路径
let { pathname } = url.parse(req.url);
if (pathname == '/' || pathname == '/index') {
res.end('欢迎来到首页');
} else if (pathname == '/list') {
res.end('欢迎来到列表页页');
} else {
res.end('抱歉, 您访问的页面出游了');
}
});
中枢有了,那么接下来我们再了解一下数据库!
为什么要使用数据库?
- 动态网站中的数据都是存储在数据库中的
- 数据库可以用来持久存储客户端通过表单收集的用户信息
- 数据库软件本身可以对数据进行高效的管理
数据库即存储数据的仓库,可以将数据进行有序的分门别类的存储。它是独立于语言之外的软件,可以通过API去操作它。
常见的数据库软件有:mysql、mongoDB、oracle。
Node.js通常使用MongoDB作为其数据库,具有高性能,易使用,存储数据方便等特点,完全使用JavaScript语法即可操作。
MongoDB概念
数据库操作
开启mongoDB服务
在命令行工具中运行net start mongodb
即可开启MongoDB服务。
创建数据库
在MongoDB中不需要显式创建数据库,如果正在使用的数据库不存在,MongoDB会自动创建。
数据库连接
// 引用mongoose包
const mongoose = require('mongoose');
// 数据库链接
mongoose.connect('mongodb://localhost/playground')
.then(() => console.log('数据库连接成功'))
.catch(err => console.log('数据库连接失败', err));
创建集合
创建集合实际上就是对集合设定规则。
// 设置集合规则
const courseSchema = new mongoose.Schema({
name: String,
author: String,
tags: [ String ],
data: { type: Date, default: Date.now },
isPublished: Boolean
});
// 使用规则创建集合 返回集合类(集合构造函数)
const Course = mongoose.model('Course', courseSchema);
创建文档
创建文档实际上就是向集合中插入具体的数据。
// 创建集合类的实例
const course = new Course({
name: 'Node.js course',
author: 'wangjian',
tags: ['node', 'backend'],
isPublished: true
});
// 保存实例
course.save();
插入数据的另一种形式
Course.create({name: 'JavaScript基础', author: '黑马讲师', isPublish: true}, (err, doc) => {
// 错误对象
console.log(err)
// 当前插入的文档
console.log(doc)
});
// create还支持promise 可以写成下面的形式
Course.create({name: 'JavaScript基础', author: '黑马讲师', isPublish: true})
.then(doc => console.log(doc))
.catch(err => console.log(err))
查询文档
Course.find({
name: 'wangjian',
isPublished: true
})
.limit(10),
.sort({name: 1}) // 1 升序 -1 降序
.select({name: 1, tags: 1})
.exec((err, data) => {})
删除文档
// 删除单个
Course.findOneAndDelete({}).then(result => console.log(result))
// findOneAndDelete只会删除一个如果有多条数据 就删除第一个
// 删除多个
User.deleteMany({}).then(result => console.log(result))
Course.findByIdAndRemove(id, err => {});
更新文档
// 更新单个
User.updateOne({查询条件}, {要修改的值}).then(result => console.log(result))
// 更新多个
User.updateMany({查询条件}, {要更改的值}).then(result => console.log(result))
// 根据id更新
Course.findByIdAndUpdate(id, {
$set: {
author: 'mosh',
isPublished: false
}
}, err => {})
最后是我们的案例环节!
- 搭建网站服务器,实现客户端与服务器端的通信
- 连接数据库,创建用户集合,向集合中插入文档
- 当用户访问/list时,将所有用户信息查询出来
- 实现路由功能
- 呈现用户列表页面
- 从数据库中查询用户信息 将用户信息展示在列表中
首先创建服务器连接数据库响应用户页面
// 1. 创建 Web 服务器
// 2. 连接数据库
// 3. http://localhost:3000/list 响应用户列表页面
const http = require('http');
const app = http.createServer();
app.on('request', async (req, res) => {
})
app.listen(3000, () => console.log('Server running on http://localhost:3000'));
然后连接数据库的代码,创建集合规则,// 根据集合规则创建集合
// 1. 创建 Web 服务器
// 2. 连接数据库
// 3. http://localhost:3000/list 响应用户列表页面
const http = require('http');
const app = http.createServer();
const url = require('url');
// 连接数据库的代码
const mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/info', {
useNewUrlParser: true,
useUnifiedTopology: true
}).then(() => console.log('连接成功')).catch(err => console.log(err, '连接失败'));
// 创建集合规则
const userSchema = new mongoose.Schema({
name: {
type: String,
required: true,
minlength: 2,
maxlength: 20
},
age: {
type: Number,
min: 18,
max: 80
},
password: String,
email: String,
hobbies: [ String ]
});
// 根据集合规则创建集合
const User = mongoose.model('User', userSchema); // users
最后查询数据库中的所有内容,显示用户列表的内容!
// 1. 创建 Web 服务器
// 2. 连接数据库
// 3. http://localhost:3000/list 响应用户列表页面
const http = require('http');
const app = http.createServer();
const url = require('url');
// 连接数据库的代码
const mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/info', {
useNewUrlParser: true,
useUnifiedTopology: true
}).then(() => console.log('连接成功')).catch(err => console.log(err, '连接失败'));
// 创建集合规则
const userSchema = new mongoose.Schema({
name: {
type: String,
required: true,
minlength: 2,
maxlength: 20
},
age: {
type: Number,
min: 18,
max: 80
},
password: String,
email: String,
hobbies: [ String ]
});
// 根据集合规则创建集合
const User = mongoose.model('User', userSchema); // users
app.on('request', async (req, res) => {
const method = req.method;
const {pathname, query} = url.parse(req.url, true);
if(method === "GET") {
if(pathname === '/list') {
// 查询数据库中的所有内容
const users = await User.find();
// 显示用户列表的内容
let str = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>用户列表</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container">
<h6>
<a href="add.html" class="btn btn-primary">添加用户</a>
</h6>
<table class="table table-striped table-bordered">
<tr>
<td>用户名</td>
<td>年龄</td>
<td>爱好</td>
<td>邮箱</td>
<td>操作</td>
</tr>`;
users.forEach(item => {
str += `
<tr>
<td>${item.name}</td>
<td>${item.age}</td>
<td>
<span>抽烟</span>
<span>喝酒</span>
<span>烫头</span>
`;
item.hobbies.forEach(item2 => {
str += `<span>${item2}</span> `;
});
str +=`
</td>
<td>${item.email}</td>
<td>
<a href="" class="btn btn-danger btn-xs">删除</a>
<a href="" class="btn btn-success btn-xs">修改</a>
</td>
</tr>
`;
});
str += `
</table>
</div>
</body>
</html>
`;
res.end(str);
}
} else if(method === "POST") {
}
});
app.listen(3000, () => console.log('Server running on http://localhost:3000'));