Node.js 学习 | 青训营笔记

101 阅读4分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 7 天

浏览器中的 JS

浏览器中 JS 运行时组成:
1

JS 是否可以做后端开发

可以

Node.js 就是为了使用 JavaScript 做后端开发而创建的后端环境。

1

Node.js 运行环境

和浏览器相似,Nodejs 的运行环境也由 V8 引擎和内置 API 组成。

2

当然,作为后端环境,Nodejs 无法调用 DOM 和 BOM 等浏览器 API。

它能做什么?

学习路径

  • JS 基础语法
  • Nodejs 内置 API
  • 第三方框架

在Node环境中执行 JS 代码

  • 打开终端
  • 输入 node 要执行的 js 文件的路径
node app.js

在这里创建一个文件名为 api.js 的 Node 文件。

书写下面的代码内容:

console.log("Hello Node.js");

打开 PowerShell 执行:

node app.js

终端中会打印我们要 console 的内容:

2

HTTP 模块介绍

HTTP 模块能够创建 web 服务器,提供 web 服务。

主要方法:

  • http.createServer()

模块的作用

常见的服务器软件: IIS 、 Apache 等,安装了这些软件的电脑就能成为一个 web 服务器。Node.js 就能够为我们前端开发者创造一台服务器环境。

计网相关

IP地址

互联网上每台计算机的唯一地址。只有在知道对方电脑的IP地址的情况下才能进行数据通信。

域名和服务器

可以将 IP地址 比喻成身份证号,那么域名就可以比作 姓名 ,域名更加便于记忆。

创建服务器

模块导入

同样是使用 require 导入。

const http=require('http')

创建实例

const server = http.createServer()

绑定 request 事件

// .on 方法可以绑定 request 事件
server.on('request',(req ,res)=>{
    // 监听。只要有客户端来请求服务器,就会触发request事件,从而调用这个事件函数
    console.log('Someone visit our web server');
})

启动服务器

// 调用 server.listen(端口号,cb回调)方法,即可启动web服务器
// 这里运行在 80 端口
server.listen(80,()=>{
    console.log('http server running at http://127.0.0.1');
})

req 请求对象

// .on 方法可以绑定 request 事件
server.on('request',(req ,res)=>{
    // req是请求对象,包含了和客户端相关的数据和属性
    // req.url 是客户端的 URL 地址
    // req.method 是客户端的请求类型
    const str = 'Your request url is ${req.url},and request method is ${req.method}';
    console.log(str);
})

创建脚本 server1.js ,执行脚本。

const http = require("http");

const server = http.createServer();
// req是请求对象,包含了与客户端相关的属性和数据
server.on("request", (req) => {
  // req.url 是客户端的 URL 地址
  const url = req.url;
  // req.method 是客户端的请求方式
  const method = req.method;
  const str = "Your request url is ${url},and request method is ${method}";
  console.log(str);
});
server.listen(80, () => {
  console.log("server running at http://127.0.0.1");
});
node server1

终端运行结果:

server running at http://127.0.0.1

然后打开浏览器访问后,终端输出:

Your request url is / ,and request method is GET

在浏览器输入框输入 http://127.0.0.1/index.html ,终端运行结果:

Your request url is /index.html ,and request method is GET

res 响应对象

如果在 request 事件中,如果想访问服务器相关的数据属性,可以采取下面的方式:

// .on 方法可以绑定 request 事件
server.on('request',(req ,res)=>{
    // res 是响应对象,它包含了与服务器相关的数据和属性,例如:
    const str = 'Your request url is ${req.url},and request method is ${req.method}';
    // res.end()方法,向客户端发送指定的内容,结束此次过程
    res.end(str);
})

修改上一节的代码:

const http = require("http");

const server = http.createServer();
// req是请求对象,包含了与客户端相关的属性和数据
server.on("request", (req,res) => {
  // req.url 是客户端的 URL 地址
  const url = req.url;
  // req.method 是客户端的请求方式
  const method = req.method;
  const str = `Your request url is ${url} ,and request method is ${method}`;
  console.log(str);
  // 调用 res 响应一些消息,将 str 返回给客户端
  // highlight-start
  res.end(str);
  // highlight-end
});
server.listen(80, () => {
  console.log("server running at http://127.0.0.1");
});

执行,这时候客户端就能拿到返回结果了:

server running at http://127.0.0.1
Your request url is /index.html ,and request method is GET
Your request url is /favicon.ico ,and request method is GET

1

中文乱码问题

当使用res.end(str);发送中文内容时,会发生乱码,因此需要设置响应的值:

server.on("request", (req,res) => {
  // req.url 是客户端的 URL 地址
  const url = req.url;
  // req.method 是客户端的请求方式
  const method = req.method;
  const str = `Your request url is ${url} ,and request method is ${method}`;
  // 设置响应头
  // highlight-start
  res.setHeader('content-Type','text/html;charset=utf-8');
  // highlight-end
  // 调用 res 响应一些消息,将 str 返回给客户端
  res.end(str);
});

不同 URL 响应不同的 html 内容

  • 获取请求的 URL 地址
  • 设置默认返回内容,404
  • 判断是否为 / 或者 /index.html 首页
  • 判断是否为 /about.html 页面(其他页面)
  • 防止中文乱码
  • 使用 res.end() 将内容相应给客户端
const http = require("http");

const server = http.createServer();
// req是请求对象,包含了与客户端相关的属性和数据
server.on("request", (req, res) => {
  const url = req.url;
  let content = "<h1>404 Not Found</h1>";
  if (url === "/" || url === "/index.html") {
    content = "<h1>首页</h1>";
  } else if (url === "/about.html") {
    content = "<h1>关于</h1>";
  }
  res.setHeader("content-Type", "text/html; charset=utf-8");
  res.end(content);
});
server.listen(80, () => {
  console.log("server running at http://127.0.0.1");
});

访问 //index.html :
1

访问 /about.html:
2

访问不存在的页面:

3

经过这堂课的学习,我了解了 Node.js 的起源、运用领域、以及使用 Node.js 创建 Web 服务器的基本方法。