使用nodejs创建HTTP基础知识

最新推荐文章于 2024-05-09 00:45:00 发布
最新推荐文章于 2024-05-09 00:45:00 发布
阅读量478 收藏 2
点赞数
分类专栏： 前端学习 nodejs 文章标签： http javascript 服务器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fujiaxu666/article/details/121183557
版权

使用Nodejs创建HTTP服务

创建HTTP服务初体验

//1. 引入HTTP模块
const http = require('http');
//2. 调用方法 创建服务对象
/**
 * request 请求报文的封装对象
 * response 响应报文的封装对象
 */
const server = http.createServer(function(request,response){
    /* 
    此方法向服务器发出信号，表明所有响应头和正文都已发送；该服务器应认为此消息已完成。 response.end() 方法必须在每个响应上调用。

如果指定了 data，则其效果类似于调用 response.write(data, encoding) 后跟 response.end(callback)。

如果指定了 callback，则将在响应流完成时调用。
    */
    response.end('Hello HTTP server');
});
//3. 监听端口
/**
 * 端口号: 计算机的服务窗口，一共有65536个窗口，也就是2^16
 * 默认端口：80 
 * 127.0.0.1 这是本机的地址
 */
server.listen(8000,function(){
    console.log("服务已经启动，端口8000监听中....");
})

局域网和云服务器上的配置

局域网

使用ipconfig查到自己的ip地址，使用ip地址加端口号一样能访问到本机开启的服务，在同一个局域网的主机能同样能访问到。

云服务器

获得请求报文中的参数

在请求的参数中包括行，头，体。

请求行和请求头

const http = require('http');
const url = require('url');//已被弃用， 使用URL类
const server = http.createServer(function (request, response) {
    // 获取报文中的内容 
    // 行中有 请求的方式    url     HTTP/1.1
    // 1. 请求的类型
    console.log(request.method);
    //2. 请求的url / 也就是url的路径内容和查询字符串
    // 也就是 /pathname?quertstring
    console.log(request.url);
    // 提取url里面的路径
    console.log(url.parse(request.url));
    console.log(url.parse(request.url).pathname);// 获取路径
    console.log(url.parse(request.url).search);// 获取路径加查询字符串
    console.log(url.parse(request.url).query);// 获取查询字符串
    console.log(url.parse(request.url,true).query);// 把查询字符串转为对象，这样皆可以获取参数了

    //3  协议的版本 
    console.log(request.httpVersion);
    console.log('Hello');
    response.end(); // 这个必须要加入，不要无法显网页，也就是客户端没有得到回应

    // 请求头信息的获取
    console.log(request.headers);
})

server.listen(80, function () {
    console.log('服务器已启动， 端口80 监听中');
})

请求体

只要POST方法才有请求体，那么这里就创建一个form表单来测试。

<!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>Document</title>
</head>
<body>
    <form action="http://127.0.0.1" method="post">
        用户名<input type="text" name="username" id=""><br>
        密码<input type="password" name="password" id="">
        <button>登录</button>
        <!-- button 和 submit都可以 -->
    </form>
</body>
</html>

const http = require('http');
const querystring = require('querystring');// 解析请求字符串
const server = http.createServer(function (request, response) {
    // get请求，请求体是空的，只有post有请求体。
    //1. 声明字符串
    let body = '';
    //2. 绑定 data 事件
    request.on('data',(chunk) => {// 每读取一次数据，执行一次回调
        // 拼接
        body += chunk.toString();
    });
    //3. 绑定 end 事件,请求体数据读取完毕
    request.on('end',()=>{
        console.log(body);
        console.log(querystring.parse(body));
        response.end('get it ');// 应该放在这个，要不然他是同步流，还没读完就响应了
    })
})

server.listen(80, function () {
    console.log('服务器已启动， 端口80 监听中');
})

响应结果设置

code

响应头

对于响应头，我们可以做设置状态码和状态字符创

  • 状态码
	response.statusCode = 404;   // 设置状态码

image-20211103230402987

  • 响应字符串

    response.statusMessage = 'haha';

    image-20211103230820572

响应头

使用`response.setHeader()`

response.setHeader('Content-type','text/html;charset=utf-8');
response.setHeader('abc','1000');

image-20211103232526730

响应体

响应体不能为空，否则无法响应成功

响应体不能为空，如果没有write写入，而且end里面没有内容，那么将无法响应。

response.end() 和 response.write()都可以写入响应体

response.write('111');
response.write('22');
response.write('33');
response.write('132');
response.end();// 响应体不能为空，如果没有write写入，而且end里面没有内容，那么将无法响应

code

 const http = require('http');
 http.createServer((request, response) => {
     // 响应行
     /* 
         响应行分为：协议版本    状态码  状态字符串
     */
     // 状态码
        response.statusCode = 404;   
    // 响应状态码
        response.statusMessage = 'haha';
     // 响应头
        response.setHeader('Content-type','text/html;charset=utf-8');
        response.setHeader('abc','1000');
     // 响应体
        response.write('111');
        response.write('22');
        response.write('33');
        response.write('132');
     response.end();// 响应体不能为空，如果没有write写入，而且end里面没有内容，那么将无法响应
 }).listen(80)

案例–背景变色

在查询字符中/?bg=rgb(x,x,x) 可以更换背景颜色

const http = require('http');
const url = require('url');
const server = http.createServer((request, response) => {
    // 中文乱码，必须设置响应头,或者是在用<meta charset = 'UTF-8'>设置，但是响应头的优先级更高
    response.setHeader('Content-Type','text/html;charset=utf-8');
    // 获取url中的bg参数
    let bg = url.parse(request.url,true).query.bg ? url.parse(request.url,true).query.bg : 'pink';
    response.end(`
    <!DOCTYPE html>
        <html lang='zh-CN'>
        <head>
        
        <style>
                body {
                 background: ${bg};
                }
             </style>
        </head>
        <body>
            <h1>
                红红火火恍恍惚惚或或或或或或或
            </h1>
        </body>
        </html>
        
    `);
});
server.listen(80, () => {
    console.log('server has started');
})

注意点：

  1. 中文必须在请求头设置字符集response.setHeader('Content-Type','text/html;charset=utf-8');,或者在用<meta charset = 'UTF-8'>设置，但是响应头的优先级更高。
  2. 使用模板字符串超级方便。

案例–根据路径返回页面

get /login 返回登录页面

get /register 返回注册页面

post /register 保存注册结果（用户名和密码）

nodejs代码：

const http = require('http');
const url = require('url');
const fs = require('fs');
const qs = require('querystring');
const server = http.createServer((request, response) => {
    // 中文乱码，必须设置响应头,或者是在用<meta charset = 'UTF-8'>设置，但是响应头的优先级更高
    response.setHeader('Content-Type','text/html;charset=utf-8');
    let method = request.method;
    let pathname = url.parse(request.url,true).pathname;
    if(method.toUpperCase() === 'GET' && pathname === '/login'){
        response.end(fs.readFileSync(__dirname + '/login.html'));// 同步读入
    }else if(method.toUpperCase() === 'GET' && pathname === '/register'){
        response.end(fs.readFileSync(__dirname + '/register.html'));// 同步读入
    }else if(method.toUpperCase() === 'POST' && pathname === '/register'){
        // 提取用户注册的信息
        let body = '';
        request.on('data',chunk=>{
            // chunk 数据块
            body+=chunk; 
        })
        // 读取结束
        request.on('end',()=>{
            // 解析用户数据为对象
            const data = qs.parse(body);
            let temp = fs.readFileSync('./user.json').toString();// 这次读取出来的是Buffer
            temp = JSON.parse(temp);// 解析为对象
            temp.data.push(data);// 向对象里面的数组压入数据
            fs.writeFileSync('./user.json',JSON.stringify(temp));
            console.log(`用户提交的内容为${body}`);
        })
        //console.log(body);// 这里是同步的，所以body是空字符串
        response.end('注册成功');
    }else{
        response.end('404 Not found');
    }
});

server.listen(80, () => {
    //console.log(__dirname);// 这个可以打印当前文件的绝对路径
    console.log('server has started');
})

user.json

{
    "data": [{
        "username": "124124",
        "pws": "123123"
    }]
}

register.html

如果表单的action不加协议头和主机名，那么它会使用当前的url。

<!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>
    <style>
        form{
           
            height: 500px;
            width: 500px;
            margin: 100px auto;
        }
    </style>
</head>
<body>
    <form action="http://127.0.0.1/register" method="post">
        <div class="container">
            <input type="text" name='username'>
            <br>
            <input type="password" name='pws'>
            <br>
            <input type="submit" value="注册">
        </div>
    </form>
</body>
</html>

服务端使用<script>标签引入js代码

html中的代码link,script ，img这种可以请求外部文件的标签也可以发送请求。只需要对路径进行一些设置即可。

不过关需要注意的是，如果加了/那么前面就需要路径，不管是.还是什么。但是若前面不加/那么就意味着当前路径。

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>Document</title>
</head>
<body>
    <!-- 这里完全可以写 /引入JavaScript代码.js-->
    <script src="http://127.0.0.1/引入JavaScript代码.js"></script>
</body>
</html>

引入的js代码

let body = document.body;
body.innerHTML = '引入成功';

nodejs代码

const http = require('http');
const url = require('url');
const fs = require('fs');
const qs = require('querystring');
const server = http.createServer((request, response) => {
    response.setHeader('Content-Type','text/html;charset=utf-8');
    let pathname = decodeURI(url.parse(request.url,true).pathname);// 解决路径中文问题
    console.log(pathname);
    if(pathname === '/引入JavaScript代码.js'){
        console.log(123);
        response.end(fs.readFileSync('./引入JavaScript代码.js'));
    }else{
        response.end(fs.readFileSync('./引入JavaScript代码.html'));
    }
});

server.listen(80, () => {
    console.log('server has started');
})

感悟

可以吧url看做服务器开启服务文件夹的目录，在它的后面加上文件的pathname，那么就可以通过服务器开启的服务来判断该响应什么文件给它。

多路径请求

像之前那个写if else判断实在是太麻烦了，而且无法写出所以的情况。

我们在项目下创建一个public文件来存放页面代码

public

  index.html

  css

  		index.css

  		app.css

  js

  		index.js

定义一个filePath

// 网站的根目录，是网站请求服务的根目录
let dirctory = __dirname + '/public';
let filePath =  dirctory + pathname;

访问文件

fs.readFile(filePath,(err,data)=>{
	if(err){// 如果没有找到此文件
		response.statusCode = 404;
        response.end("<h1>404 Not Found</h1>");
    }else{
        response.end(data);
    }
})

服务交互总结

输入url，开始向服务请求资源，在解析为资源的时候，发现又有请求，又想服务器发送请求，得到需要的数据继续解析。如此往复可得到最终的结果。

我是真的垃圾啊
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
nodejs：使用NodeJS创建API
02-15
本文将深入探讨如何使用Node.js创建API，这涉及到的主要知识点包括：Express框架、路由处理、中间件、数据库集成以及错误处理。 1. **Express框架**：Express是Node.js中最流行的Web应用框架，它简化了构建Web服务...
Node学习十四 —— 使用node创建HTTP请求
qq_51574759的博客
09-25 4052
Node擅长处理I/O操作，所以它不仅合适提供HTTP服务，也适合使用这些服务。接下来你将学习使用http模块和第三方模块执行和控制http请求。在HTTP协议中，有两个重要的属性：URL和方法。最常见的是GET、POST方法，还有PUT等别的方法。
通过nodejs搭建HTTP服务器
莫宛的博客
11-03 5884
文章目录通过nodejs搭建HTTP服务器前提搭建步骤实例启动服务器 通过nodejs搭建HTTP服务器 nodejs是一个用于解析执行javaScript代码的环境（它不是语言，不是框架），通过nodejs，javaScript可以完全脱离浏览器运行，也可以用于搭建服务器。 前提 安装好nodejs 搭建HTTP服务器，我们需要Nodejs提供的API 搭建步骤 加载nodejs提供的API—http，此模块的职责就是创建并编写服务器 通过http.createserver()方法创建一个web
nodejs 创建HTTP服务器详解
最新发布
大剑师兰特的GIS世界
05-09 1098
在Node.js中，创建一个HTTP服务器非常直接，这得益于内置的`http`模块。首先，你需要导入Node.js的`http`模块，然后使用`http.createServer()`方法创建服务器。这个方法接受一个回调函数作为参数，该回调函数会在每次有请求到达服务器时被调用。回调函数自身接收两个参数：`request`（请求对象）和`response`（响应对象）。通过这两个对象，你可以访问请求的详细信息并控制响应的内容。
node制作http服务器,NodeJS 搭建 HTTP 服务器
weixin_32795427的博客
07-29 483
前言在 NodeJS 中用来创建服务的模块是 http 核心模块，本篇就来介绍关于使用 http 模块搭建 HTTP 服务器和客户端的方法，以及模块的基本 API。HTTP 服务器1、创建 HTTP 服务器在 NodeJS 中，创建 HTTP 服务器可以与 net 模块创建 TCP 服务器对比，创建服务器有也两种方式。方式 1：const http = require("http");const ...
教你如何使用Nodejs搭建HTTP web服务器并发布上线公网
weixin_73961973的博客
05-18 2821
Node.js 是能够在服务器端运行 JavaScript 的开放源代码、跨平台运行环境。Node.js 由 OpenJS Foundation（原为 Node.js Foundation，已与 JS Foundation 合并）持有和维护，亦为 Linux 基金会的项目。Node.js 采用 Google 开发的 V8 运行代码，使用事件驱动、非阻塞和异步输入输出模型等技术来提高性能，可优化应用程序的传输量和规模。这些技术通常用于资料密集的即时应用程序。Node.js 大部分基本模块都用 JavaScri
Node.js 创建HTTP服务器
weixin_44860226的博客
08-11 320
用node.js构建一个可以工作的 HTTP 服务器。
Nodejs基础知识
06-19
Nodejs基础知识 Nodejs是javascript在服务器端的运行环境， Nodejs是采用谷歌浏览器的V8引擎，由C++语言编写的。本质上是一个javascript的运行环境。 Nodejs可以解析js代码，而且没有浏览器安全级别的限制。 ...
nodejs基础知识
01-20
Node.js基础教程：深入理解JavaScript运行环境与应用 Node.js是一种基于Chrome V8 JavaScript引擎的开源、跨平台的运行环境，由Ryan Dahl于2009年创立。它允许开发者使用JavaScript编写服务器端代码，打破了...
Nodejs创建web服务器.zip
10-26
标题 "Nodejs创建web服务器.zip" 提供了一个关键线索，即这个压缩包包含了一份使用Node.js构建Web服务器的示例。Node.js是一个基于Chrome V8引擎的JavaScript运行环境，它让开发者能够在服务器端使用JavaScript进行...
FinApi:使用nodeJS创建的Finance API
03-22
1. **Node.js基础**：首先，你需要熟悉Node.js的基础知识，包括模块系统（如CommonJS）、npm（Node包管理器）用于安装和管理依赖，以及其异步编程模型。了解如何创建和运行Node.js应用程序，以及如何使用Node.js内置...
【搭建HTTP服务器】使用Nodejs搭建简单的HTTP服务器
lingxw的博客
05-22 2644
Node.js 是能够在服务器端运行 JavaScript 的开放源代码、跨平台运行环境。Node.js 由 OpenJS Foundation（原为 Node.js Foundation，已与 JS Foundation 合并）持有和维护，亦为 Linux 基金会的项目。Node.js 采用 Google 开发的 V8 运行代码，使用事件驱动、非阻塞和异步输入输出模型等技术来提高性能，可优化应用程序的传输量和规模。这些技术通常用于资料密集的即时应用程序。Node.js 大部分基本模块都用 JavaScri
Nodejs快速搭建简单的HTTP服务器，并发布公网远程访问
weixin_74957752的博客
04-23 1425
服务器噢
如何在node.js里创建一个http服务
qq_67332173的博客
09-16 906
如何在node.js里创建一个http服务
Node学习十一 —— 创建HTTP服务器
qq_51574759的博客
09-22 438
HTTP是一个用来进行传送内容的应用程序的应用层协议，它将TCP用作传输协议，并且是万维网进行数据通信的基础。首选的应用程序部署方案之一就是在互联网上提供HTTP服务，用来响应HTTP客户端的请求，几乎常见的软件程序里面都会使用这一项技术。
Node创建HTTP服务
读心悦
08-05 1149
最近准备继续学习Node了，先创建HTTP服务试试： const http = require('http'); // 创建HTTP服务 const server = http.createServer((request, response) => { response.writeHead(200, { 'Content-Type': 'text/plain' }) response.end("hello worle!"); }); server.listen(8080); cons
如何使用http模块
weixin_66059613的博客
11-15 1722
如何使用http模块
node制作http服务器,搭建简单的nodejs http服务器详解
weixin_39793105的博客
07-29 691
搭建简单的nodejs服务器通过一些简单配置我们就可以搭建一台基于nodejs的http服务器通过switch配置url路由的方法// 这是一个简单的Node HTTP服务器,能处理当前目录的文件// 并能实现两种特殊的URL用于测试// 用HTTP://localhost:8000或http://127.0.0.1:8000连接这个服务器// 首先加载所有需要用到的模块var http = re...
nodejs之http模块
NealCristmas的博客
11-15 258
1.基本使用 客户端发送请求 client.js const http=require('http'); const client=http.request({ host:"127.0.0.1", port:7777,//设置端口 protocol:"http:", method:"get", path:"/" },res=&gt;{ console.log(res) })...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值