HTTP、模块化

HTTP协议

包括请求行、请求头、请求体
http常见请求方法：
在这里插入图片描述
url统一资源请求符，其本身也是一个字符串
在这里插入图片描述
响应体的内容格式是非常灵活的,常见的响应体格式有:
1.HTML 2.CSS 3. JavaScript 4.图片 5.视频 6.JSON
响应状态码：
在这里插入图片描述
在这里插入图片描述

IP本身是一个数字标识IP 用来标志网络设备,实现设备间通信
在这里插入图片描述
端口：应用程序的数字标识
作用：实现不同主机应用程序之间的通信
响应报文包含响应行，响应头，响应体

HTTP服务注意事项

在这里插入图片描述
https默认端口号是443

创建http服务

// 导入http模块
const http=require('http');
// 创建服务对象
// 请求  响应
const server=http.createServer((request,response)=>{
    response.setHeader('content-type','text/html;charset=utf-8');//设置响应头
    response.end('Hello HTTP Server');//设置响应体
})
// 3.监听端口，启动服务
server.listen(9000,()=>{
    console.log('服务已经启动。。。');
})

获取http请求报文

在这里插入图片描述

//1. 导入http模块
const http=require('http');
//2.创建服务对象
// 请求  响应
const server=http.createServer((request,response)=>{
    // 1.声明一个变量
    let body='';
    // 2.绑定事件
    request.on('data',chunk=>{
        body+=chunk;//chunk是buffer，在做加法的时候会转化为字符串
    })
    // 3.绑定end事件
    request.on('end',()=>{
        console.log(body);
        response.end("Hello http");
    })
})
// 3.监听端口，启动服务
server.listen(9000,()=>{
    console.log('服务已经启动。。。');
})

提取HTTP请求报文

查找路径和字符串的两种方式

const http=require('http');
// 1.导入url模块
const url=require('url');
const server=http.createServer((request,response)=>{
    // 2.解析request.url
    let res=url.parse(request.url,true);//第二个属性为true时quire属性将会变成一个对象
    // 路径
    let pathname=res.pathname;
    console.log(pathname);
    // 查询字符串
    let keyword=res.query.keyword;
    console.log(keyword);
    response.end('url');
})
server.listen(9000,()=>{
    console.log('服务已经启动。。。');
})

const http=require('http');
const server=http.createServer((request,response)=>{
    // 实例化url对象
    // let url=new URL('http://www.xxx.com/search?a=100&b=200')
    // let url=new URL('/search?a=100&b=200','http://127.0.0.1');
    let url=new URL(request.url,'http://127.0.0.1');
    // 输出路径
    console.log(url.pathname);
    // 输出keyword查询字符串
    console.log(url.searchParams.get('keyword'));
    response.end('url new');
})
server.listen(9000,()=>{
    console.log('服务已经启动。。。');
})

响应请求练习

在这里插入图片描述

const { log } = require('console');
const http=require('http');
const server=http.createServer((request,response)=>{
    // 获取请求的方法
    // let method=request.method;
    let {method}=request;
    // 获取请求的url路径
    let {pathname}=new URL(request.url,'http://127.0.0.1');
    response.setHeader('content-type','text/html;charset=utf-8');
    // 判断
    if(method==='GET' && pathname==='/reg'){
        response.end('注册界面');
    }else if(method==='GET' && pathname==='/login'){
        response.end('登陆界面');
    }else{
        response.end('404 Not Found');
    }
    // response.end('practice');
});
server.listen(9000,()=>{
    console.log('服务器已经启动。');
})

设置HTTP的响应报文

在这里插入图片描述
write可以多次调用
每一个请求,在处理的时候必须要执行end 方法的，有且只能有一个end方法

write和end 的两种使用情况:
//1.write和end 的结合使用响应体相对分散
response.write('xx');
response.write('xx');
response.write('xx');
response.end();//每一个请求,在处理的时候必须要执行end 方法的
//2.单独使用end 方法响应体相对集中
response.end('xxx');

练习：列表隔行换色

搭建HTTP服务,响应一个4行3列的表格,并且要求表格有隔行换色效果,且点击单元格能高亮显示

const http=require('http');
//引入fs模块
const fs=require('fs');
const server=http.createServer((request,response)=>{
    // 读取文件内容
    let html=fs.readFileSync(__dirname+'./test.html')
    response.end(html);//end()参数可以是Buffer和字符串
})
server.listen(9000,()=>{
    console.log('服务已经启动');
})

网页资源加载基本过程

网页资源的加载都是循序渐进的,首先获取HTML的的容,然后解析HTML在发送其他资源的请求,如css,Javascript,图片等。理解了这个丙容对于后续的学习与成长有菲常大的帮助

模块练习：网页资源引入

const http=require('http');
const fs=require('fs');
const server=http.createServer((request,response)=>{
    //获取请求url的路径
    let {pathname}=new URL(request.url,'http://127.0.0.1');
    // 读取文件内容
    // 不能写响应头编码，否则没有效果
    if(pathname==='/'){
        let html=fs.readFileSync(__dirname+'/test.html');
        response.end(html);//end()参数可以是Buffer和字符串
    }else if(pathname==='/index.css'){
        let css=fs.readFileSync(__dirname+'/index.css');
        response.end(css);//end()参数可以是Buffer和字符串
    }else if(pathname==='/index.js'){
        let js=fs.readFileSync(__dirname+'/index.js');
        response.end(js);//end()参数可以是Buffer和字符串
    }else{
        response.statusCode=404;
        response.end('<h1>404 Not Found</h1>')
    }
})
server.listen(9000,()=>{
    console.log('服务已经启动');
})

静态资源服务

静态资源是指内容长时间不发生改变的资源,例如图片,视频,CSS文件,JS文件,HTML文件,字体文件等
动态资源是指内容经常更新的资源,例如百度首页,网易首页,京东搜索列表页面等

静态资源目录与网站根目录

HTTP服务在哪个文件夹中寻找静态资源,那个文件夹就是静态资源目录,也称之为网站根目录

思考:Vscode中使用live-server访问HTML时,它启动的服务网站根目录是谁?
vscode所打开的文件夹

const http=require('http');
const fs=require('fs');
const server=http.createServer((request,response)=>{
    //获取请求url的路径
    let {pathname}=new URL(request.url,'http://127.0.0.1');
    // 声明一个变量
    let root=__dirname+'/page';
    // let root=__dirname+'/../';//__dirname得到的是当前文件所在的文件夹，../是得到上一级文件夹
    // 拼接文件路径
    let filePath=__dirname+'/page'+pathname;
    // 读取文件 fs 异步api
    fs.readFile(filePath,(err,data)=>{
        if(err){
            response.statusCode=500;
            response.end("文件读取失败~");
            return;//防止代码继续往下执行
        };
        response.end(data);
    })
    // mime插件获取pathname的mime赋值content-type
});
server.listen(9000,()=>{
    console.log('服务已经启动');
});

网页中的URL-绝对路径-相对路径

在这里插入图片描述
在这里插入图片描述
网页中使用URL的场景小结(包括但不限于)如下场景:
a标签href、link标签href、script标签src、img标签src、video audio标签、srcform中的action、AJAX请求中的URL

设置资源类型(mime类型)

媒体类型(通常称为Multipurpose Internet Mail Extensions或MIME类型)是一种标准,用来表示文档、文件或字节流的性质和格式。

mime类型结构:[type]/[subType]
例如: text/html text/css image/jpeg image/png application/json

HTTP服务可以设置响应头Content-Type来表明响应体的MIME类型,浏览器会根据该类型决定如何处理资源
下面是常见文件对应的mime类型：
在这里插入图片描述
对于未知的资源类型,可以选择application/octet-stream类型,浏览器在遇到该类型的响应时,会对响应体内容进行独立存储,也就是我们常见的下载效果

完善静态资源错误处理

请求方法不是GET的时候也会出现错误

const http=require('http');
const fs=require('fs');
const path=require('path');
const server=http.createServer((request,response)=>{
    if(request.method !== 'GET'){
        response.statusCode=405;
        response.end('<h1>404 Not Found</h1>');
        return;
    }
    let {pathname}=new URL(request.url,'http://127.0.0.1');
    let root=__dirname+'/page';
    let filePath=root+pathname;
    fs.readFile(filePath,(err,data)=>{
        if(err){
            response.setHeader('content-type','text/html;charset=utf-8');
            switch(err){
                case 'ENOENT':
                    response.statusCode=404;
                    response.end('<h1>404 Not Found</h1>');
                    break;
                case 'EPERM':
                    response.statusCode=403;
                    response.end('<h1>403 Forbidden</h1>');
                    break;
                default:
                    response.statusCode=500;
                    response.end('<h1>500 Internal Server Error</h1>');
            }
            response.statusCode=500;
            response.end("文件读取失败~");
            return;//防止代码继续往下执行
        };
        // mime插件获取pathname的mime赋值content-type
        // 获取文件后缀名
        let ext=path.extname(filePath).slice(1);//返回的结果是.css,slice(1)从索引1开始
        // 匹配对应的类型
        let type=mimes[ext];
        if(type){
            response.setHeader('content',type+';text/html;charset=utf-8');
        }else{
            // 没有匹配到
            response.setHeader('content-type','application/octet-stream');
        };
        response.end(data);
    })
}).listen(9000,()=>{
    console.log('服务已经启动');
});

GET和POST的区别

在这里插入图片描述

GET 和 POST 是 HTTP 协议请求的两种方式。区别：

  1. 作用：
    给服务端新增数据的是post，例如创建新账户；
    向服务端索要资源，加载某些东西是get
  2. 参数位置：
    GET 带参数请求是将参数缀到 URL 之后，在地址栏中输入 url 访问网站就是 GET 请求，
    POST 带参数请求是将参数放到请求体中
  3. POST 请求相对 GET 安全一些，因为在浏览器中参数会暴露在地址栏
  4. GET 请求大小有限制，一般为 2K，而 POST 请求则没有大小限制

模块化

介绍

1.模块化是一个将一个复杂的程序文件依据一定规则(规范)拆分成多个文件的过程
其中拆分出的每个文件就是一个模块，模块的内部数据是私有的,不过模块可以暴露内部数据以便其他模块使用

2.模块化项目：编码时是按照模块一个一个编码的,整个项目就是一个模块化的项目

3.模块化的一些好处:减少命名冲突、高复用性、高维护性

模块暴露数据两种方式:

1.module.exports=value
2.exports.name=value
使用时有几点注意:
1.module.exports可以暴露任意数据
2.不能使用exports =value 的形式暴露数据,模块内部module与exports的隐式关系exports =module.exports ={}
require返回的值是module.exports的值不是exports
在这里插入图片描述
exports.tiemo=tiemo相当于往{}里添加数据

node.js导入模块

在模块中使用 require 传入文件路径即可引入文件
require 使用的一些注意事项：

  1. 对于自己创建的模块，导入时路径建议写 相对路径 ，且不能省略 ./ 和 ../
  2. 同名文件查找顺序 .js .json .node
  3. js 和 json 文件导入时可以不用写后缀，c/c++编写的 node 扩展文件也可以不写后缀，但是一
    般用不到
  4. 如果导入其他类型的文件，会以 js 文件进行处理
  5. 如果导入的路径是个文件夹，则会 首先 检测该文件夹下 package.json 文件中 main 属性对应的文件，
    如果 main 属性不存在，或者 package.json 不存在，则会尝试导入文件夹下的 index.js 和index.json ，如果还是没找到，就会报错
  6. 导入 node.js 内置模块时，直接 require 模块的名字即可，无需加 ./ 和 ../，比如fs、HTTP、path

导入模块的基本流程

require 导入 自定义模块 的基本流程

  1. 将相对路径转为绝对路径，定位目标文件
  2. 缓存检测
  3. 读取目标文件代码
  4. 包裹为一个函数并执行（自执行函数）。通过 arguments.callee.toString() 查看自执行函数
  5. 缓存模块的值
  6. 返回 module.exports 的值

CommonJS模块化规范

module.exports、exports以及require这些都是CommonJS模块化规范中的内容。
而Node.js是实现了CommonJS模块化规范,二者关系有点像JavaScript与ECMAScript

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mfbz.cn/a/578268.html

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

【每日算法】理论：深度学习基础 刷题：KMP算法思想

【每日算法】理论：深度学习基础 刷题：KMP算法思想

上期文章 【每日算法】理论&#xff1a;常见网络架构 刷题&#xff1a;力扣字符串回顾 文章目录 上期文章一、上期问题二、本期理论问题1、注意力机制2、BatchNorm 和 LayerNorm 的区别3、Bert 的参数量是怎么决定的。4、为什么现在的大语言模型都采用Decoder only架构&#x…
阅读更多...
11 c++版本的贪吃蛇

11 c++版本的贪吃蛇

前言 呵呵 这大概是 大学里面的 c 贪吃蛇了吧 有一些 面向对象的理解, 但是不多 最近 因为想要 在单片机上面移植一下 贪吃蛇, 所以 重新拿出了一下 这份代码 然后 将它更新为 c 版本, 还是 用了一些时间 这里 具体的实现 就不赘述, 仅仅是 发一下代码 以及 具体的使用…
阅读更多...
NXP恩智浦 S32G电源管理芯片 VR5510 安全概念 Safety Concept (万字长文详解，配21张彩图)

NXP恩智浦 S32G电源管理芯片 VR5510 安全概念 Safety Concept (万字长文详解，配21张彩图)

NXP恩智浦 S32G电源管理芯片 VR5510 安全概念 Safety Concept (万字长文详解&#xff0c;配21张彩图) 1. 简介 本应用笔记描述了与S32G处理器和VR5510 PMIC相关的安全概念。该文档涵盖了S32G和VR5510的安全功能以及它们如何相互作用&#xff0c;以确保对ASIL D安全完整性级别…
阅读更多...
Leetcode-轮转数字

Leetcode-轮转数字

189. 轮转数组 - 力扣&#xff08;LeetCode&#xff09;https://leetcode.cn/problems/rotate-array/ 目录 189. 轮转数组 - 力扣&#xff08;LeetCode&#xff09;https://leetcode.cn/problems/rotate-array/ 题目 解题 第一种方法 第二种方法 题目 给定一个整数数组 …
阅读更多...
【深度学习（1）】研0和研1如何上手深度学习及定方向

【深度学习（1）】研0和研1如何上手深度学习及定方向

深度学习&#xff08;1&#xff09; 基础部分书籍鱼书 (理论部分) 视频课程我是土堆&#xff08;代码部分&#xff09; 提升部分李沐的动手学深度学习李沐老师的书 定方向网站&#xff1a; paperwithcode谷歌学术找论文 基础部分 书籍 鱼书 (理论部分) 适合入门&#xff0c;…
阅读更多...
Java项目：基于SSM框架实现的汽车推荐系统分前后台（源码+数据库）

Java项目：基于SSM框架实现的汽车推荐系统分前后台（源码+数据库）

一、项目简介 本项目是一套基于SSM框架实现的汽车推荐系统 包含&#xff1a;项目源码、数据库脚本等&#xff0c;该项目附带全部源码可作为毕设使用。 项目都经过严格调试&#xff0c;eclipse或者idea 确保可以运行&#xff01; 该系统功能完善、界面美观、操作简单、功能齐全…
阅读更多...
Servlet和Tomcat运作过程

Servlet和Tomcat运作过程

记录一下前后端请求交互过程&#xff08;不涉及Spring框架&#xff09;&#xff1a; 编写一个UserServlet 在web.xml文件中编写映射路径 编写前端
阅读更多...
linux系统-FTP服务配置

linux系统-FTP服务配置

目录 一、FTP简介 1.什么是FTP&#xff1f;&#xff1f;&#xff1f; 2.FTP的两种模式 二、安装配置FTP服务 1.关闭防火墙和核心防护 2.安装VSFTPD 3.修改配置文件 4.黑白名单设置 一、FTP简介 1.什么是FTP&#xff1f;&…
阅读更多...
jvm中的引用类型

jvm中的引用类型

Java中的引用类型 1.强引用 一个对象A被局部变量、静态变量引用了就产生了强引用。因为局部变量、静态变量都是被GC Root对象关联上的&#xff0c;所以被引用的对象A&#xff0c;就在GC Root的引用链上了。只要这一层关系存在&#xff0c;对象A就不会被垃圾回收器回收。所以只要…
阅读更多...
Linux---自定义协议

Linux---自定义协议

应用层协议 一、协议定制---以网络计算器为例 网络计算机功能---进行-*/^&|的运算并返回结果 请求和响应的结构体如下 // Protocol.hpp #pragma once #include <iostream> #include <memory> class Request { public:Request(){}Request(int data_x, int da…
阅读更多...
无人机探测技术，无人机侦测频谱仪技术实现详解

无人机探测技术，无人机侦测频谱仪技术实现详解

频谱仪&#xff0c;又称为频谱分析仪&#xff0c;是一种用于测量电信号频谱特性的仪器。其基本原理是通过将时域信号转换为频域信号&#xff0c;进而分析信号的频率成分、功率分布、谐波失真等参数。频谱仪利用快速傅里叶变换&#xff08;FFT&#xff09;算法&#xff0c;将采集…
阅读更多...
13 c++版本的五子棋

13 c++版本的五子棋

前言 呵呵 这大概是 大学里面的 c 五子棋了吧 有一些 面向对象的理解, 但是不多 这里 具体的实现 就不赘述, 仅仅是 发一下代码 以及 具体的使用 然后 貌似 放在 win10 上面执行 还有一些问题, 渲染的, 应该很好调整 五子棋 #include<Windows.h> #include<io…
阅读更多...
安规电容定义和应用

安规电容定义和应用

安规电容 定义 失效后&#xff0c;不会导致电击&#xff0c;不危及人身安全的电容器&#xff0c;称之为安规电容 分类 分为X电容和Y电容 X电容–跨接在电力线&#xff08;L-N&#xff09;之间的电容&#xff0c;一般选用金属薄膜电容&#xff0c;X电容有多种颜色&#xff…
阅读更多...
VUE3----Swiper滑动切换图片

VUE3----Swiper滑动切换图片

Swiper滑动切换图片 可以切换焦点图&#xff0c;兼容小程序 <template><view class"cc-swiper-container" v-if"imageList.length > 0"><swiper class"swiper":class"swiperClassName" :circular"circular&q…
阅读更多...
Docker常用命令(镜像、容器)

Docker常用命令(镜像、容器)

一、镜像 1.1 存出镜像 1.2 载入镜像 1.3 上传镜像 二、容器 2.1 容器创建 2.2 查看容器的运行状态 ​2.3 启动容器 2.4 创建并启动容器 2.5 在后台持续运行 docker run 创建的容器 2.6 终止容器运行 2.7 容器的进入 ​2.8把宿主机的文件传入到容器内部 2.9 从容器…
阅读更多...
C语言 | Leetcode C语言题解之第51题N皇后

C语言 | Leetcode C语言题解之第51题N皇后

题目&#xff1a; 题解&#xff1a; int solutionsSize;char** generateBoard(int* queens, int n) {char** board (char**)malloc(sizeof(char*) * n);for (int i 0; i < n; i) {board[i] (char*)malloc(sizeof(char) * (n 1));for (int j 0; j < n; j) board[i][…
阅读更多...
Spring Cloud学习笔记（Feigh）：简介，实战简单样例

Spring Cloud学习笔记（Feigh）：简介，实战简单样例

这是本人学习的总结&#xff0c;主要学习资料如下 - 马士兵教育 1、Netflix Feign简介2、Open Feign的简单样例2.1、dependency2.2、代码样例 1、Netflix Feign简介 Netfilx Feign是用来帮助发送远程服务的&#xff0c;它让开发者觉得调用远程服务就像是调用本地方法一样&…
阅读更多...
服务器数据恢复—ESXi无法识别数据存储和VMFS文件系统如何恢复数据？

服务器数据恢复—ESXi无法识别数据存储和VMFS文件系统如何恢复数据？

服务器数据恢复环境&#xff1a; 一台某品牌服务器&#xff0c;通过FreeNAS来做iSCSI&#xff0c;然后使用两台同品牌服务器做ESXi虚拟化系统。 FreeNAS层为UFS2文件系统&#xff0c;使用整个存储建一个稀疏模式的文件&#xff0c;挂载到ESXi虚拟化系统。ESXi虚拟化系统中有3台…
阅读更多...
怎样通过HTTP协议实现远程控制两路开关

怎样通过HTTP协议实现远程控制两路开关

怎样通过HTTP协议实现远程控制两路开关呢&#xff1f; 本文描述了使用HTTP协议调用HTTP接口&#xff0c;实现控制两路开关&#xff0c;两路开关可控制两路照明、排风扇等电器。 可选用产品&#xff1a;可根据实际场景需求&#xff0c;选择对应的规格 序号设备名称厂商1智能Wi…
阅读更多...
flutter开发实战-build apk名称及指令abiFilters常用gradle设置

flutter开发实战-build apk名称及指令abiFilters常用gradle设置

flutter开发实战-build apk名称及指令abiFilters常用gradle设置 最近通过打包flutter build apk lib/main.dart --release&#xff0c;发现apk命名规则需要在build.gradle设置。这里记录一下。 一、apk命名规则 在android/app/build.gradle中需要设置 android.applicationVa…
阅读更多...
最新文章

Copyright @ 2022~2023

友情链接： 我的编程经验分享 一条长河网 尧图网站开发 尧图建网站