七、http模块

news2025/4/4 3:01:35

          HTTP —— 超文本传输协议,用于规范客户端浏览器和服务端以何种格式进行通信和数据交互;HTTP由请求和响应构成的,是一个标准的客服端服务器模型。 

HTTP请求响应过程

        先简单的来了解以下HTTP的请求响应过程:1.地址解析:解析URL得到协议名,主机名,端口和对象路径,如果主机名不是IP地址而是域名的话,需要通过DNS(域名系统)进行解析为IP地址;2.封装HTTP请求报文:将URL地址按照HTTP格式封装成HTTP请求报文(请求行,请求消息头,空行,请求体)存放在客户都的Socket对象;3.建立TCP连接:HTTP工作开始之前先与Web服务器建立TCP连接;4.浏览器向Web服务发送请求报文(建立TCP之后存在客户都的Socket对象通过TCP发送给Web服务器);5.Web服务器接收请求并向浏览器发送响应报文(状态行,响应消息头,空行,响应体);6.Web服务器关闭TCP连接。

http模块引入

        http模块是Node.js内置的核心模块,通过使用这个核心模块可以轻松地创建一个HTTP服务器,实现浏览器与Web服务器间的请求响应。

const http = require('http');

http.createServer() —— 创建Web服务器

        通过使用http.createServer()来创建Web服务器实例:

// 创建Web服务器
const server = http.createServer();

.on() —— 监听 request 请求

       为Web服务器绑定request事件,监听客户端发过来的request请求;只要客户端发来请求,就会触发request,从而调用事件处理函数;

// .on —— 监听request请求
server.on('request',function(req,res){
    console.log('执行事件处理');
})

.listen() —— 启动Web服务器

        调用 .listen( 端口 ,callback ) 方法来启动Web服务器;

server.listen('8080',function(){
    console.log('Web Server Running ...')
})

       用node命令执行文件;

        在浏览器中去请求 http://127.0.0.1:8080 或 http://localhost ,会触发.listen() 执行事件处理;


server.on('request',function(req,res){ })

req对象 —— 请求

        当服务器接收到客户端的请求就可以调用server.on()为服务器绑定request事件处理函数,同时可以在事件处理函数中访问客户端相关的数据和属性;

server.on('request',function(req,res){
    console.log('访问客户端属性');
    console.log('req.url',req.url);
    console.log('req.method',req.method);
})

res对象 —— 响应

        在request事件处理函数中,如果要访问服务器相关的数据或者属性可以使用res响应对象;

server.on('request',function(req,res){
    const str = '准备向客户端发送数据...';    
    res.end(str);   // 向客户端发送指定内容,并结束请求处理过程
})

        用 node命令 执行文件;可以看到数据已经发到客户端,但出现数据乱码现象,如下:

解决中文乱码问题 

       为防止中文数据显示乱码,需要设置请求头 Content-Type:text/html,charset=utf-8 ;

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


动态响应 

        以上通过请求http://127.0.0.1:8080或http://localhost:8080获取的请求响应内容,现在是通过不同的url来响应不同的内容,也就是能够进行一个动态的内容响应;首先要先获取客户端请求的url地址,判断用户请求的url地址是否存在,不存在如何处理,存在又如何将数据内容响应给客户端;

const http = require('http');

const server = http.createServer();
server.on('request',function(req,res){
    const url = req.url;
    let content = '<h2>404 Not Found</h2>';
    if(url === '/' || url === '/index.html'){
        content = '<p> 当前处于/首页 </p>'
    }
    res.setHeader('Content-Type','text/html;charset=utf-8');
    res.end(content);
})

server.listen('8080',function(){
    console.log('Web Server running...');
})

        用 node命令 执行,并通过浏览器请求地址http://127.0.0.1:8080或http://localhost:8080并修改url路径 /index.html 和 /my.html 进行测试:


http.request()

        使用 http.request(options[,callback]) 来做一个 GET 请求,options 参数可以是一个对象,字符串或者URL对象,若为字符串,会自动使用url.parse()进行解析,若为URL对象,会自动使用转为options对象;options中的参数有很多,这里列举了几个:

         下面来进行http.request()方法使用,请求本地搭建的服务器(127.0.0.1:3000)数据:

// request.js文件
const options = {
    hostname:'localhost',
    port:3000,
    method:'GET',
    path:'/api/swiperList'
}

// const options = 'http://127.0.0.1:3000/api/swiperList';

const request = http.request(options,(res)=>{
    // console.log(res);
    res.setEncoding('utf-8');
    res.on('data',function(chunk){
        console.log(JSON.parse(chunk));
    })
})

request.on('error',function(err){
    console.log("错误异常:",err.message);
})

request.end();


http.get()

        使用http.get(options,[callback]),http.get()和http.request()中的options的参数接收相同,大多数的请求都是GET请求且不带请求体,所以http.get()和http.request()的区别是设置请求为GET且自动调用req.end();

// get.js文件
const http = require('http');
const options = {
    hostname:'localhost',
    port:3000,
    method:'GET',
    path:'/api/swiperList'
}
var data = '';
var request = http.request(options,(response)=>{
    // console.log(response);
    response.setEncoding('utf-8');
    response.on('data',(chunk)=>{
        // console.log(chunk);
        data += chunk;
    })
    response.on('end',()=>{
        JSON.parse(data).swiperList.map((item)=>{
            console.log(item);
        });
    })
})

request.on('error',(error)=>{
    console.log("请求异常:",error);
})

request.end();


后端解决跨域问题

        前面通过http模块创建HTTP服务器,那么现在服务器通过前端页面发来的request请求时,例如前端页面是127.0.0.1:5500发出的请求是127.0.0.1:3000的请求,这里就存在跨域问题,浏览器的同源策略!

        前端页面在讲Vue的时候讲过可以使用VScode中的一个小工具[ Live Server ]来进行模拟,那么如果不清楚的这里提供一个跳转地址:第十九篇 fetch请求

前端页面 index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>全国行政区</title>
</head>
<body>
    <div id='app'>
        <h2>全国行政区</h2>
        <ul class="city">
        </ul>
    </div>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script>
        $.ajax({
            url:'http://127.0.0.1:3000'
        }).then(res=>{
            const rs = JSON.parse(res); 
            for(const i in rs.result){
                $('.city').append('<li>'+rs.result[i].name+'</li>');
            }         
        })
    </script>
</body>
</html>

后端服务:(未处理跨域)

const http = require('http');
const fs = require('fs');
const server = http.createServer();
server.on('request',(req,res)=>{
    let data = fs.readFileSync(__dirname + '/全国行政区数据.json')
    res.end(data);
})
server.listen(3000,()=>{
    console.log('Web Server Running ...')
})

测试效果

         以上测试效果就是没有处理跨域的一个问题导致的,那么处理跨域的解决方法有很多种,这里不过的描述,等遇到再说,下面是通过这个后端来解决这个跨域的问题,设置以下3个属性:

Access-Control-Allow-Origin",'*'
Access-Control-Allow-Headers","X-Requested-With"
Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS"

        下面来通过http模块创建HTTP服务器和fs模块将已经准备好了的json读取之后响应回去给客户端;通过浏览器模拟客户端发起请求127.0.0.1:3000看是否能够获取到json数据的响应;

const http = require('http');
const fs = require('fs');

const server = http.createServer();

server.on('request',(req,res)=>{
    // 解决跨域
    res.setHeader("Access-Control-Allow-Origin",'*');    // *表示任何IP可以访问
    res.setHeader("Access-Control-Allow-Headers","X-Requested-With"); 
    res.setHeader("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS"); 
    res.setHeader("Content-Type","text/plain;charset=utf-8");
    let data = fs.readFileSync(__dirname + '/全国行政区数据.json')
    res.end(data);
})

server.listen(3000,()=>{
    console.log('Web Server Running ...')
})

        执行 node命令 将 服务器启动...  

        浏览器请求响应数据,如下可以看到客户端发起请求可以拿到json数据内容;

        以上就是本篇的全部内容了,下面是本篇的一些补充信息,感谢大家的支持!


 响应对象res常用的方法:

方法描述
res.json()返回JSON数据
res.send()根据不同的内容,返回不同格式的HTTP响应
res.render渲染模板页面
res.redirect()重定向到指定的URL
res.status()设置响应状态码,如:200,404,500...
res.set()设置响应报头的信息
res.end()结束请求 - 响应循环

 

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

普通人为什么要学习python?有什么用

为什么要学习python&#xff1f; 比如新媒体职业&#xff1a; 1、简单来说&#xff0c;你会python后就相当于自己建造一个属于自己工作区块的微博热搜榜。你可以利用爬虫、收据抓取等技术知道哪些话题近期特别火&#xff0c;为什么火、有什么共通点&#xff0c;然后根据这些依…

3.1 多集放大电路的耦合方式

在实际应用中&#xff0c;常对放大电路的性能提出多方面的要求。所以&#xff0c;仅靠任何一种基本的放大电路并不能满足要求&#xff0c;此时可以选择多个基本放大电路级联在一起构成多级放大电路。 组成多级放大电路的每一个基本放大电路称为一级&#xff0c;级与级之间的连接…

Win11的两个实用技巧系列之玩游戏闪跳、错误代码0x80004005解决

Win11玩游戏经常无缘无故跳回桌面怎么解决? 最近有Win11用户反应&#xff0c;自己在玩游戏的时候遇到了经常无缘无故跳回桌面的情况&#xff0c;本文就为大家带来了详细的解决方法&#xff0c;需要的朋友一起看看吧 最近有Win11用户反应&#xff0c;自己在玩游戏的时候遇到了…

关于ShardingSphere内置分片算法及其数据倾斜问题总结

ShardingSphere是一款不错的分库分表中间件&#xff0c;并且其内置提供了多种分片算法。但是使用内置的分片算法会造成数据倾斜问题。下面以5.2.0版本的ShardingSphere详细介绍下几种内置分片算法并且分析下数据倾斜问题。 一、ShardingSphere内置分片算法介绍 根据官网描述&…

web前端-javascript-包装类(String,Number,Boolean,基本数据类型调用方法先转换为对象再调换)

包装类 1. 说明 在 JS 中为我们提供了三个包装类&#xff0c;通过这三个包装类可以将基本数据类型的数据转化为对象String() 可以将基本数据类型字符串转换为 String 对象 Number() 可以将基本数据类型的数字转换为 Number 对象 Boolean() 可以将基本数据类型的布尔值转换为 …

【C语言】重要函数atoi的使用

目录 一、atoi函数的介绍 二、atoi函数的使用 三、atoi函数的模拟实现 一、atoi函数的介绍 一个专门将字符串转换为整数的库函数&#xff0c;具体用法如下&#xff1a; 字符串str&#xff0c;将其内容转化为整数&#xff0c;该整数作为int值返回。 二、atoi函数的使用 atoi函…

CentOS7安装apache2并启动

CentOS7安装apache2并启动源码安装启动和停止源码安装 地址&#xff1a;https://downloads.apache.org/httpd/ https://downloads.apache.org/httpd/httpd-2.4.54.tar.gz 参考&#xff1a;https://www.cnblogs.com/xiangqs/p/8663947.html 启动和停止 网上搜到的都是/usr/lo…

linux安装redis

目录 一、准备redis 二、上传redis到linux 三、编译与安装 四、修改配置文件 五、设置开放的服务或端口号或直接关闭防火墙 法1&#xff1a; 法2&#xff1a; 六、验证是否成功 1.直接在linux启动客户端 2.在windows启动redis客户端&#xff0c;连接linux的redis服务…

Java+mysql基于ssm的大学生求职招聘系统

本求职招聘管理系统主要包括系统用户管理模块、企业新闻管理模块、招聘发布会管理、招聘信息管理、登录模块、和退出模块等多个模块。它帮助求职招聘管理实现了信息化、网络化,通过测试,实现了系统设计目标,相比传统的管理模式,本系统合理的利用了求职招聘管理数据资源,有效的减…

Docker方式发布jar文件

在IDEA中将SpringBoot项目打为jar包步骤&#xff1a; 1、打开项目的pom.xml文件&#xff0c;添加或修改packaging标签&#xff0c;如下图&#xff1a; <packaging>jar</packaging> 2、点击右侧maven&#xff0c;展开lifecycle&#xff0c;先clean&#xff0c;然后…

普通人应该怎么赚钱,下班后可在家操作的四个兼职副业分享

大家好&#xff0c;我是蝶衣王的小编 不少朋友发觉&#xff0c;单靠薪水好像已经很难再存下钱了&#xff0c;甚至有时候还不够一个月的开销。实际上&#xff0c;如果你想要提升月收益&#xff0c;你可以选择发展副业。那发展什么副业才能赚钱呢 有小伙伴要问&#xff1a;我要…

使用DevEco Device Tool编译并烧录全部步骤和过程详解

一、前言 我们上一篇讲了 “如何搭建设备开发的环境” ,这一篇继续上一篇提到的BearPi-HM_Nano 源码 我购买的是这款 BearPi开发板,有设备的话更好,没有设备的话,一样可以跟着我们的文章一起学习。 在进行编译烧录前需要先下载BearPi-HM_Nano 源码,我们接着往下看。 二…

【漏洞复现】软件漏洞——栈溢出漏洞复现及其原理详解 一文解明什么是栈溢出漏洞

软件漏洞造成软件漏洞原因:如何预防?软件漏洞常见名词栈溢出漏洞复现前准备造成软件漏洞原因: 本质原因是因为人类目前还没办法在原点上区分数据与代码,说白了就是目前人们还没理解编写安全代码的真正方法。 如何预防? 通过修改自身代码、公共库函数的安全性降低漏洞出现频…

springboot 定时任务基础模板

springboot 如何开启定时任务 基础版本 一、在启动类上面加上 EnableScheduling 即可开启定时 SpringBootApplication EnableAsync EnableScheduling public class ScheduleApplication {public static void main(String[] args) {SpringApplication.run(ScheduleApplicatio…

ios xcode Architectures

各个Architecture参数的含义 Architectures 当前设备环境下支持的指令架构。真机环境下是armV7、arm64。模拟器环境下是X86_64、i386、arm64&#xff08;m1设备&#xff09;。 Build Active Architecture Only 是否只编译当前设备的指令架构。值是YES或者NO。一般Debug环境…

什么是数据管理?看完这篇你一定有收获

如今的大数据成为一切生产经营活动的主要驱动因素。由于每天都会产生大量数据&#xff0c;因此我们需要有更好的数据管理解决方案是理所当然的。任何想要在今天取得成功的企业或企业都需要了解数据管理的内容、原因和方式。 大数据&#xff0c;就其本质而言&#xff0c;需要一…

SI/PI仿真概述:有源高速信号、阻抗、滤波方案分析

SI/PI仿真概述 Signal Integrity与Power integrity是当今高速电子产品系统及PCB设计必须保证的两大因素&#xff0c;SI/PI直接决定系统信号、电源质量从而影响数据的正确传输与系统误码率。如何在设计方案阶段评估及模拟SI/PI&#xff0c;就需要借助专业EDA工具进行仿真分析。…

Vue3基础语法(三)

文章目录认识计算属性案例methods vs computedsetter getterwatch侦听器的基本配置其他方式综合案例认识计算属性 案例 插值语法实现&#xff1a; 以上代码不好维护&#xff0c;多次使用会出现重复代码 methods实现&#xff1a; computed实现案例 methods vs computed sett…

【深度思考】如何优雅的校验参数?

在日常的开发工作中&#xff0c;为了保证落库数据的完整性&#xff0c;参数校验绝对是必不可少的一部分&#xff0c;本篇文章就来讲解下在项目中该如何优雅的校验参数。 假设有一个新增学员的接口&#xff0c;一般第一步我们都会先校验学员信息是否正确&#xff0c;然后才会落…

为什么硬盘在macbook上无法编辑?mac不能往移动硬盘拷东西

为什么硬盘在macbook上无法编辑&#xff1f;如果您只想在Mac上查看NTFS文件&#xff0c;只需将NTFS 外置存储设备连接到mac电脑并查看文件。但要编辑或传输文件&#xff0c;则需要NTFS工具。 NTFS文件格式与Mac不兼容&#xff0c;但许多用户仍然喜欢使用NTFS文件&#xff0c;而…