Node(一)

客户端与服务器

上网的目的

刷微博、浏览新闻、在线听音乐、在线看电影…

上网的本质目的:通过互联网的形式来获取和消费资源

服务器

上网过程中,负责存放和对外提供资源的电脑,叫做服务器。

在这里插入图片描述

客户端

上网过程中,负责获取和消费资源的电脑,叫做客户端。

在这里插入图片描述

URL地址

URL地址的概念

URL(全称是UniformResourceLocator)中文叫统一资源定位符,用于标识互联网上每个资源的唯一存放位置。浏览器只有通过URL地址,才能正确定位资源的存放位置,从而成功访问到对应的资源。

常见的URL举例:

http://www.baidu.com

http://www.taobao.com

URL地址的组成部分

URL地址一般由三部组成:

  1. 客户端与服务器之间的通信协议
  2. 存有该资源的服务器名称
  3. 资源在服务器上具体的存放位置
https://blog.csdn.net/qq_43434300/article/details/108519041

通信协议:https

服务器名称:blog.csdn.net

资源在服务器上具体存放的位置:qq_43434300/article/details/108519041

客户端与服务器通信

图解通信过程

在这里插入图片描述

客户端

  1. 打开浏览器
  2. 输入要访问的网站地址
  3. 回车,向服务器发起资源请求

服务器端

  1. 服务器接收到客户端发来的资源请求
  2. 服务器在内部处理这次请求,找到相关的资源
  3. 服务器把找到的资源,响应(发送)给客户端

注意

  1. 客户端与服务器之间的通信过程,分为“请求 – 处理 – 响应”三个步骤。
  2. 网页中的每一个资源,都是通过“请求 – 处理 – 响应”的方式从服务器获取回来的。

开发者工具分析

  1. 打开 Chrome 浏览器
  2. Ctrl+Shift+I 打开 Chrome 的开发者工具
  3. 切换到 Network 面板
  4. 选中 Doc 页签
  5. 刷新页面,分析客户端与服务器的通信过程

在这里插入图片描述

在这里插入图片描述

服务器提供的资源

网页中常见的资源

  1. 文字内容
  2. Image 图片
  3. Audio音频
  4. Video视频
  5. 网页中的数据

数据也是资源

网页中的数据,也是服务器对外提供的一种资源。例如股票数据、各行业排行榜等

数据是网页的灵魂

  • HTML是网页的骨架
  • CSS是网页的颜值
  • Javascript是网页的行为
  • 数据,则是网页的灵魂

骨架、颜值、行为皆为数据服务数据,在网页中无处不在

如何请求数据

数据,也是服务器对外提供的一种资源。只要是资源,必然要通过 请求 – 处理 – 响应 的方式进行获取。

如果要在网页中请求服务器上的数据资源,则需要用到 XMLHttpRequest 对象。

XMLHttpRequest(简称 xhr)是浏览器提供的 js 成员,通过它,可以请求服务器上的数据资源。

最简单的用法 var xhrObj = new XMLHttpRequest()

资源的请求方式

客户端请求服务器时,请求的方式有很多种,最常见的两种请求方式分别为 get 和 post 请求。

  • get 请求通常用于获取服务端资源(向服务器要资源)

    例如:根据 URL 地址,从服务器获取 HTML 文件、css 文件、js文件、图片文件、数据资源等

  • post 请求通常用于向服务器提交数据(往服务器发送资源)

    例如:登录时向服务器提交的登录信息、注册时向服务器提交的注册信息、添加用户时向服务器提交的用户信息等各种数据提交操作

初识 Node.js

前端回顾

已经掌握的技术

HTML、CSS、JavaScript

浏览器中的JavaScript组成

在这里插入图片描述

JavaScript在浏览器中被执行

在这里插入图片描述

不同的浏览器使用不同的JavaScript解析引擎:

  • Chrome 浏览器 => V8
  • Firefox 浏览器 => OdinMonkey (奥丁猴)
  • Safri 浏览器 => JSCore
  • IE 浏览器 => Chakra (查克拉)
  • etc…

其中,Chrome 浏览器的 V8 解析引擎性能最好!

JavaScript操作DOM和BOM

在这里插入图片描述

每个浏览器都内置了 DOM 、BOM 这样的 API函数,因此,浏览器中的 JavaScript 才可以调用它们。

JavaScript运行环境

运行环境是指代码正常运行所需的必要环境 。

在这里插入图片描述

总结:

  1. V8 引擎负责解析和执行 JavaScript 代码。
  2. 内置 API 是由 运行环境 提供的特殊接口,只能在所属的运行环境中被调用 。

JavaScript能否做后端开发

通常做后端开发的语言使用的有Java、Python、PHP、C#等

而JavaScript已经完全可以实现后端开发的需求,其条件是JavaScript的运行环境从浏览器引擎更改为Node.js环境即可实现。

Node.js简介

Node.js® is a JavaScript runtime built on Chrome’s V8 JavaScript engine.
Node.js是 一个基于 Chrome V8 引擎的 JavaScript 运行环境 。

Node.js的官网地址: https://nodejs.org/zh-cn/

Node.js中的JS 运行环境

在这里插入图片描述

注意:

  1. 浏览器 是 JavaScript 的 前端运行环境 。
  2. Node.js 是 JavaScript 的 后端运行环境 。
  3. Node.js 中 无法调用 DOM 和 BOM 等浏览器内置 API 。

Node.js的功能

Node.js作为一个 JavaScript 的运行环境,仅仅提供了基础的功能和 API 。然而,基于 Node.js 提供的这些基础能,很多强大的工具和框架如雨后春笋,层出不穷,所以学会了 Node.js ,可以让前端程序员胜任更多的工作和岗位:

  1. 基于 Express 框架( http://www.expressjs.com.cn/ cn/),可以快速构建 Web 应用
  2. 基于 Electron 框架( https://electronjs.org/ org/),可以构建跨平台的桌面应用
  3. 基于 restify 框架( http://restify.com/ com/),可以快速构建 API 接口项目
  4. 读写和操作数据库、创建实用的命令行工具辅助前端开发、 etc…

总之:Node.js 是大前端时代的“尚方宝剑”,有了 Node.js 这个超级 buff 的加持,前端程序员的行业竞争力会越来越强!

Node.js的组成

浏览器中的JavaScript:

JavaScript基础语法+浏览器内置API(DOM+BOM)+第三方库(jQuery、art-template等)

Node.js:
JavaScript基础语法+Node.js内置API模块(fs、path、http+第三方API模块 express、mysql等)

Node.js环境的安装

安装包可以从Node.js 的官网首页直接下载,进入到 Node.js 的官网首页( https://nodejs.org/en/en/),点击绿色的按钮,下载所需的版本后,双击直接安装即可。

LTS版本和Current版本

  1. LTS为长期稳定版,对于追求稳定性的企业级项目来说,推荐安装LTS版本的 Node.js 。
  2. Current为新特性尝鲜版,对热衷于尝试新特性 的用户来说,推荐安装Current版本的 Node.js。但是,Current版本中可能存在隐藏的 Bug 或安全性漏洞,因此不推荐在企业级项目中使用Current版本的Node.js

查看Node.js版本

打开终端,在终端输入命令node -v后,按下回车键,即可查看已安装的 Node.js 的版本号。

什么是终端

终端(英文:Terminal)是专门为开发人员设计的用于实现人机交互 的一种方式。
作为一名合格的程序员,我们有必要识记一些常用的终端命令,来辅助我们更好的操作与使用计算机。

Node.js中执行JS代码

  1. 打开终端
  2. 输入“node 要执行的 js 文件的路径”

终端中的快捷键

在Windows的powershell或cmd终端中,我们可以通过如下快捷键,来提高终端的操作效率:

  1. 使用↑键,可以快速定位到上一次执行的命令
  2. 使用tab键,能够快速补全路径
  3. 使用esc键,能够快速清空当前已输入的命令
  4. 输入cls命令,可以清空终端

fs文件系统模块

fs模块介绍

fs模块是Node.js官方提供的用来操作文件的模块。它提供了一系列的方法和属性,用来满足用户对文件的操作需求。

fs模块的使用

  1. 使用fs模块来操作文件,先导入fs

    const fs=require('fs');
    
  2. 读取指定文件中的内容

    fs.readFile(path,[options],callback)
    

    参数解读:

    参数1:必选参数,字符串,表示文件的路径。

    参数2:可选参数,表示以什么编码格式来读取文件。

    参数3:必选参数,文件读取完成后,通过回调函数拿到读取的结果。

  3. 向指定的文件中入内容

    fs.writeFile(file,data,[options],callback)
    

    参数解读:

    参数 1 必选 参数,需要指定一个 文件路径的字符串 ,表示文件的存放路径。

    参数 2 必选 参数,表示要写入的内容。

    参数 3 :可选参数,表示以什么格式写入文件内容,默认值是 utf8 。

    参数 4 必选 参数,文件写入完成后的回调函数。

路径动态拼接的问题

在使用fs模块操作文件时,如果提供的操作路径是以./或…/开头的相对路径时,很容易出现路径动态拼接错误的问题。

原因:代码在运行的时候,会以执行node命令时所处的目录 ,动态拼接出被操作文件的完整路径。

解决方案:

  1. 在使用fs模块操作文件时, 直接提供完整的路径,不要提供./或…/开头的相对路径,从而防止路径动态拼接的问题。
  2. 使用__dirname和相对路径进行拼接使用,__dirname属性表示当前文件所处的目录

path路径模块

path模块介绍

path模块是Node.js官方提供的、用来处理路径的模块。它提供了一系列的方法和属性,用来满足用户对路径的处理。

path模块的使用

  1. 使用path模块来处理路径,先导入path

    const path=require('path')
    
  2. 路径拼接

    使用path.join () 方法,可以把多个路径片段拼接为完整的路径字符串。

    path.join([...paths])
    

    参数解读:

    1. …paths < string> 路径片段的序列
    2. 返回值 : < string>

    注意:
    今后凡是涉及到路径拼接的操作,都要使用 path.join() 方法进行处理 。不要直接使用+进行字符串的拼接。

  3. 获取路径中的文件名

    使用path.basename () 方法,可以获取路径中的最后一部分,经常通过这个方法获取路径中的文件名。

    path.basename(path,[ext])
    

    参数解读:

    1. path< string> 必选参数,表示一个路径的字符
    2. ext< string> 可选参数,表示文件扩展名
    3. 返回:< string> 表示路径中的最后一部分
  4. 获取路径中的文件扩展名

    使用path.extname () 方法,可以获取路径中的扩展名部分。

    path.extname(path)m
    

    参数解读:

    1. path < string> 必选参数,表示一个路径的字符串
    2. 返回:< string> 返回得到的扩展名字符串

http模块

http模块介绍

在网络节点中,负责消费资源的电脑,叫做客户端;负责对外提供网络资源 的电脑,叫做服务器。

http模块是Node.js官方提供的、用来创建web服务器的模块。通过http模块提供的 http.createServer () 方法,就能方便的把一台普通的电脑,变成一台 Web 服务器,从而对外提供 Web 资源服务。

http模块的作用

服务器和普通电脑的区别在于,服务器上安装了web服务器软件,例如IIS、Apache等。通过安装这些服务器软件,就能把一台普通的电脑变成一台web服务器。

在Node.js中,我们不需要使用IIS、Apache等这些第三方web服务器软件。因为我们可以基于Node.js提供的http模块,通过几行简单的代码,就能轻松的手写一个服务器软件,从而对外提供web服务。

服务器相关的概念

IP地址

IP地址就是互联网上每台计算机的唯一地址 ,因此IP地址具有唯一性。如果把“个人电脑”比作“一台电话”,那么“IP地址”就相当于“电话号码”,只有在知道对方IP 地址的前提下,才能与对应的电脑之间进行数据通信。
IP地址的格式:通常用“点分十进制”表示成a.b.c.d)的形式,其中a,b,c,d都是0~255之间的十进制整数。例如:用点分十进表示的 IP 地址(192.168.1.1)

注意:

  1. 互联网中每台 Web 服务器,都有自己的 IP 地址 ,例如:大家可以在 Windows 的终端中运行 ping www.baidu.com 命令,即可查看到百度服务器的 IP 地址。
  2. 在开发期间,自己的电脑既是一台服务器,也是一个客户端,为了方便测试,可以在自己的浏览器中输入 127.0.0.1 这个IP 地址,就能把自己的电脑当做一台服务器进行访问了。

域名和域名服务器

  1. 尽管IP地址能够唯一地标记网络上的计算机,但 IP地址是一长串数字,不直观,而且不便于记忆,于是人们又发明了另一套字符型的地址方案,即所谓的域名( Domain Name)地址
  2. IP地址和域名是一一对应的关系,这份对应关系存放在一种叫做域名服务器(DNS Domain name server)的电脑中。使用者只需通过好记的域名访问对应的服务器即可,对应的转换工作由域名服务器实现。因此,域名服务器就是提供IP地址和域名之间的转换服务的服务器。

注意:

  • 单纯使用 IP 地址,互联网中的电脑也能够正常工作。但是有了域名的加持,能让互联网的世界变得更加方便。
  • 在开发测试期间,127.0.0.1对应的域名是localhost,它们都代表我们自己的这台电脑,在使用效果上没有任何区别。

端口号

计算机中的端口号,就好像是现实生活中的门牌号一样。通过门牌号,外卖小哥可以在整栋大楼众多的房间中,准确把外卖送到你的手中。

同样的道理,在一台电脑中,可以运行成百上千个web 服务。每个 web 服务都对应一个唯一的端口号。客户端发送过来的网络请求,通过端口号,可以被准确地交给对应的web服务进行处理。

注意:

  • 每个端口号不能同时被多个 web 服务占用。
  • 在实际应用中,URL中的80端口可以被省略。

创建web服务器

  1. 导入 http 模块

    如果需要在自己的电脑上创建一个web服务器,从而对外提供 web 服务,则需要导入 http 模块

    const http=require("http")
    
  2. 创建 web 服务器实例

    调用http.createServer方法,即可快速创建一个 web 服务器实例:

    const server=http.createServer()
    
  3. 为服务器实例绑定 request 事件, 监听客户端的请求

    为服务器实例绑定request 事件,即可监听客户端 发送过来的网络请求:

    server.on('request',(req,res)=>{
        console.log('my server')
    })
    
  4. 启动服务器

    调用服务器实例的.listen() 方法,即可启动当前的 web 服务器实例:

    server.listen(80,()=>{
    	console.log('server run at http://127.0.0.1')
    })
    

req请求对象

只要服务器接收到了客户端的请求,就会调用通过server.on () 为服务器绑定的 request 事件处理函数 。

如果想在事件处理函数中,访问与客户端相关的数据或属性

  1. req.url:客户端请求的url地址
  2. req.method:客户端的method请求类型

res响应对象

在服务器的request事件处理函数中,如果想访问与服务器相关的数据或属性

  1. res.end()方法:向客户端发送指定的内容,并结束这次请求的处理过程

解决中文乱码问题

当调用res.end()方法,向客户端发送中文内容的时候,会出现乱码问题,此时,需要手动设置内容的编码格式

setHeader等设置必须写在end响应发送之前设置好

res.setHeader(‘Content-Type’,‘text/html; charset=utf-8’)

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值