百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

Node.js GET/POST请求-Web 模块-Express 框架-教程下载

ccwgpt 2024-09-23 04:35 25 浏览 0 评论

Node.js GET/POST请求

视频地址: https://pan.baidu.com/s/1nvop1nN 密码: s9iy

在很多场景中,我们的服务器都需要跟用户的浏览器打交道,如表单提交。

表单提交到服务器一般都使用 GET/POST 请求。

本章节我们将为大家介绍 Node.js GET/POS T请求。


获取GET请求内容

由于GET请求直接被嵌入在路径中,URL是完整的请求路径,包括了?后面的部分,因此你可以手动解析后面的内容作为GET请求的参数。

node.js 中 url 模块中的 parse 函数提供了这个功能。

实例

varhttp = require('http');varurl = require('url');varutil = require('util'); http.createServer(function(req, res){res.writeHead(200, {'Content-Type': 'text/plain; charset=utf-8'}); res.end(util.inspect(url.parse(req.url, true)));}).listen(3000);

在浏览器中访问 http://localhost:3000/user?name=编程改变未来&url=www.biancheng.com 然后查看返回结果:

获取 URL 的参数

我们可以使用 url.parse 方法来解析 URL 中的参数,代码如下:

实例

varhttp = require('http');varurl = require('url');varutil = require('util'); http.createServer(function(req, res){res.writeHead(200, {'Content-Type': 'text/plain'}); // 解析 url 参数varparams = url.parse(req.url, true).query; res.write("网站名:" + params.name); res.write("\n"); res.write("网站 URL:" + params.url); res.end(); }).listen(3000);

在浏览器中访问 http://localhost:3000/user?name=编程改变未来&url=www.biancheng.com 然后查看返回结果:


获取 POST 请求内容

POST 请求的内容全部的都在请求体中,http.ServerRequest 并没有一个属性内容为请求体,原因是等待请求体传输可能是一件耗时的工作。

比如上传文件,而很多时候我们可能并不需要理会请求体的内容,恶意的POST请求会大大消耗服务器的资源,所以 node.js 默认是不会解析请求体的,当你需要的时候,需要手动来做。

基本语法结构说明

varhttp = require('http');varquerystring = require('querystring'); http.createServer(function(req, res){// 定义了一个post变量,用于暂存请求体的信息varpost = ''; // 通过req的data事件监听函数,每当接受到请求体的数据,就累加到post变量中req.on('data', function(chunk){post += chunk; }); // 在end事件触发后,通过querystring.parse将post解析为真正的POST请求格式,然后向客户端返回。req.on('end', function(){post = querystring.parse(post); res.end(util.inspect(post)); });}).listen(3000);

以下实例表单通过 POST 提交并输出数据:

实例

varhttp = require('http');varquerystring = require('querystring'); varpostHTML = '<html><head><meta charset="utf-8"><title>编程改变未来Node.js 实例</title></head>' + '<body>' + '<form method="post">' + '网站名: <input name="name"><br>' + '网站 URL: <input name="url"><br>' + '<input type="submit">' + '</form>' + '</body></html>'; http.createServer(function(req, res){varbody = ""; req.on('data', function(chunk){body += chunk; }); req.on('end', function(){// 解析参数body = querystring.parse(body); // 设置响应头部信息及编码res.writeHead(200, {'Content-Type': 'text/html; charset=utf8'}); if(body.name && body.url){// 输出提交的数据res.write("网站名:" + body.name); res.write("<br>"); res.write("网站 URL:" + body.url); }else{// 输出表单res.write(postHTML); }res.end(); });}).listen(3000);

Node.js Web 模块


什么是 Web 服务器?

Web服务器一般指网站服务器,是指驻留于因特网上某种类型计算机的程序,Web服务器的基本功能就是提供Web信息浏览服务。它只需支持HTTP协议、HTML文档格式及URL,与客户端的网络浏览器配合。

大多数 web 服务器都支持服务端的脚本语言(php、python、ruby)等,并通过脚本语言从数据库获取数据,将结果返回给客户端浏览器。

目前最主流的三个Web服务器是Apache、Nginx、IIS。


Web 应用架构

  • Client - 客户端,一般指浏览器,浏览器可以通过 HTTP 协议向服务器请求数据。

  • Server - 服务端,一般指 Web 服务器,可以接收客户端请求,并向客户端发送响应数据。

  • Business - 业务层, 通过 Web 服务器处理应用程序,如与数据库交互,逻辑运算,调用外部程序等。

  • Data - 数据层,一般由数据库组成。


使用 Node 创建 Web 服务器

Node.js 提供了 http 模块,http 模块主要用于搭建 HTTP 服务端和客户端,使用 HTTP 服务器或客户端功能必须调用 http 模块,代码如下:

var http = require('http');

以下是演示一个最基本的 HTTP 服务器架构(使用8081端口),创建 server.js 文件,代码如下所示:

var http = require('http');
var fs = require('fs');
var url = require('url');
// 创建服务器
http.createServer( function (request, response) { 
// 解析请求,包括文件名
var pathname = url.parse(request.url).pathname;
// 输出请求的文件名
console.log("Request for " + pathname + " received.");
// 从文件系统中读取请求的文件内容
fs.readFile(pathname.substr(1), function (err, data) {
if (err) {
console.log(err);
// HTTP 状态码: 404 : NOT FOUND
// Content Type: text/plain
response.writeHead(404, {'Content-Type': 'text/html'});
}else{ 
// HTTP 状态码: 200 : OK
// Content Type: text/plain
response.writeHead(200, {'Content-Type': 'text/html'}); 
// 响应文件内容
response.write(data.toString()); 
}
// 发送响应数据
response.end();
}); 
}).listen(8081);
// 控制台会输出以下信息
console.log('Server running at http://127.0.0.1:8081/');

接下来我们在该目录下创建一个 index.htm 文件,代码如下:

<html>
<head>
<title>Sample Page</title>
</head>
<body>
Hello World!
</body>
</html>

执行 server.js 文件:

$ node server.js
Server running at http://127.0.0.1:8081/

接着我们在浏览器中打开地址:http://127.0.0.1:8081/index.htm,显示如下图所示:

执行 server.js 的控制台输出信息如下:

Server running at http://127.0.0.1:8081/
Request for /index.htm received. # 客户端请求信息

Gif 实例演示


使用 Node 创建 Web 客户端

Node 创建 Web 客户端需要引入 http 模块,创建 client.js 文件,代码如下所示:

var http = require('http');
// 用于请求的选项
var options = {
host: 'localhost',
port: '8081',
path: '/index.htm' 
};
// 处理响应的回调函数
var callback = function(response){
// 不断更新数据
var body = '';
response.on('data', function(data) {
body += data;
});
response.on('end', function() {
// 数据接收完成
console.log(body);
});
}
// 向服务端发送请求
var req = http.request(options, callback);
req.end();

新开一个终端,执行 client.js 文件,输出结果如下:

$ node client.js
<html>
<head>
<title>Sample Page</title>
</head>
<body>
Hello World!
</body>
</html>

执行 server.js 的控制台输出信息如下:

Server running at http://127.0.0.1:8081/
Request for /index.htm received. # 客户端请求信息

Gif 实例演示


Express 简介

Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具。

使用 Express 可以快速地搭建一个完整功能的网站。

Express 框架核心特性:

  • 可以设置中间件来响应 HTTP 请求。

  • 定义了路由表用于执行不同的 HTTP 请求动作。

  • 可以通过向模板传递参数来动态渲染 HTML 页面。


安装 Express

安装 Express 并将其保存到依赖列表中:

$ cnpm install express --save

以上命令会将 Express 框架安装在当前目录的 node_modules 目录中, node_modules 目录下会自动创建 express 目录。以下几个重要的模块是需要与 express 框架一起安装的:

  • body-parser - node.js 中间件,用于处理 JSON, Raw, Text 和 URL 编码的数据。

  • cookie-parser - 这就是一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie,并把它们转成对象。

  • multer - node.js 中间件,用于处理 enctype="multipart/form-data"(设置表单的MIME编码)的表单数据。

$ cnpm install body-parser --save
$ cnpm install cookie-parser --save
$ cnpm install multer --save

安装完后,我们可以查看下 express 使用的版本号:

$ cnpm list express/data/www/node└── express@4.15.2 -> /Users/tianqixin/www/node/node_modules/.4.15.2@express

第一个 Express 框架实例

接下来我们使用 Express 框架来输出 "Hello World"。

以下实例中我们引入了 express 模块,并在客户端发起请求后,响应 "Hello World" 字符串。

创建 express_demo.js 文件,代码如下所示:

express_demo.js 文件代码:

//express_demo.js 文件varexpress = require('express');varapp = express(); app.get('/', function(req, res){res.send('Hello World');})varserver = app.listen(8081, function(){varhost = server.address().addressvarport = server.address().portconsole.log("应用实例,访问地址为 http://%s:%s", host, port)})

执行以上代码:

$ node express_demo.js
应用实例,访问地址为 http://0.0.0.0:8081

在浏览器中访问 http://127.0.0.1:8081,结果如下图所示:


请求和响应

Express 应用使用回调函数的参数: requestresponse 对象来处理请求和响应的数据。

app.get('/', function (req, res) {
 // --})

requestresponse 对象的具体介绍:

Request 对象 - request 对象表示 HTTP 请求,包含了请求查询字符串,参数,内容,HTTP 头部等属性。常见属性有:

  1. req.app:当callback为外部文件时,用req.app访问express的实例

  2. req.baseUrl:获取路由当前安装的URL路径

  3. req.body / req.cookies:获得「请求主体」/ Cookies

  4. req.fresh / req.stale:判断请求是否还「新鲜」

  5. req.hostname / req.ip:获取主机名和IP地址

  6. req.originalUrl:获取原始请求URL

  7. req.params:获取路由的parameters

  8. req.path:获取请求路径

  9. req.protocol:获取协议类型

  10. req.query:获取URL的查询参数串

  11. req.route:获取当前匹配的路由

  12. req.subdomains:获取子域名

  13. req.accepts():检查可接受的请求的文档类型

  14. req.acceptsCharsets / req.acceptsEncodings / req.acceptsLanguages:返回指定字符集的第一个可接受字符编码

  15. req.get():获取指定的HTTP请求头

  16. req.is():判断请求头Content-Type的MIME类型

Response 对象 - response 对象表示 HTTP 响应,即在接收到请求时向客户端发送的 HTTP 响应数据。常见属性有:

  1. res.app:同req.app一样

  2. res.append():追加指定HTTP头

  3. res.set()在res.append()后将重置之前设置的头

  4. res.cookie(name,value [,option]):设置Cookie

  5. opition: domain / expires / httpOnly / maxAge / path / secure / signed

  6. res.clearCookie():清除Cookie

  7. res.download():传送指定路径的文件

  8. res.get():返回指定的HTTP头

  9. res.json():传送JSON响应

  10. res.jsonp():传送JSONP响应

  11. res.location():只设置响应的Location HTTP头,不设置状态码或者close response

  12. res.redirect():设置响应的Location HTTP头,并且设置状态码302

  13. res.send():传送HTTP响应

  14. res.sendFile(path [,options] [,fn]):传送指定路径的文件 -会自动根据文件extension设定Content-Type

  15. res.set():设置HTTP头,传入object可以一次设置多个头

  16. res.status():设置HTTP状态码

  17. res.type():设置Content-Type的MIME类型


路由

我们已经了解了 HTTP 请求的基本应用,而路由决定了由谁(指定脚本)去响应客户端请求。

在HTTP请求中,我们可以通过路由提取出请求的URL以及GET/POST参数。

接下来我们扩展 Hello World,添加一些功能来处理更多类型的 HTTP 请求。

创建 express_demo2.js 文件,代码如下所示:

express_demo2.js 文件代码:

varexpress = require('express');varapp = express(); // 主页输出 "Hello World"app.get('/', function(req, res){console.log("主页 GET 请求"); res.send('Hello GET');})// POST 请求app.post('/', function(req, res){console.log("主页 POST 请求"); res.send('Hello POST');})// /del_user 页面响应app.get('/del_user', function(req, res){console.log("/del_user 响应 DELETE 请求"); res.send('删除页面');})// /list_user 页面 GET 请求app.get('/list_user', function(req, res){console.log("/list_user GET 请求"); res.send('用户列表页面');})// 对页面 abcd, abxcd, ab123cd, 等响应 GET 请求app.get('/ab*cd', function(req, res){console.log("/ab*cd GET 请求"); res.send('正则匹配');})varserver = app.listen(8081, function(){varhost = server.address().addressvarport = server.address().portconsole.log("应用实例,访问地址为 http://%s:%s", host, port)})

执行以上代码:

$ node express_demo2.js
应用实例,访问地址为 http://0.0.0.0:8081

接下来你可以尝试访问 http://127.0.0.1:8081 不同的地址,查看效果。

在浏览器中访问 http://127.0.0.1:8081/list_user,结果如下图所示:

在浏览器中访问 http://127.0.0.1:8081/abcd,结果如下图所示:

在浏览器中访问 http://127.0.0.1:8081/abcdefg,结果如下图所示:


静态文件

Express 提供了内置的中间件 express.static 来设置静态文件如:图片, CSS, JavaScript 等。

你可以使用 express.static 中间件来设置静态文件路径。例如,如果你将图片, CSS, JavaScript 文件放在 public 目录下,你可以这么写:

app.use(express.static('public'));

我们可以到 public/images 目录下放些图片,如下所示:

node_modules
server.jspublic/public/imagespublic/images/logo.png

让我们再修改下 "Hello World" 应用添加处理静态文件的功能。

创建 express_demo3.js 文件,代码如下所示:

express_demo3.js 文件代码:

varexpress = require('express');varapp = express(); app.use(express.static('public')); app.get('/', function(req, res){res.send('Hello World');})varserver = app.listen(8081, function(){varhost = server.address().addressvarport = server.address().portconsole.log("应用实例,访问地址为 http://%s:%s", host, port)})

执行以上代码:

$ node express_demo3.js
应用实例,访问地址为 http://0.0.0.0:8081

执行以上代码:

GET 方法

以下实例演示了在表单中通过 GET 方法提交两个参数,我们可以使用 server.js 文件内的 process_get 路由器来处理输入:

index.htm 文件代码:

<html><body><formaction="http://127.0.0.1:8081/process_get"method="GET">First Name: <inputtype="text"name="first_name"><br> Last Name: <inputtype="text"name="last_name"><inputtype="submit"value="Submit"></form></body></html>

server.js 文件代码:

varexpress = require('express');varapp = express(); app.use(express.static('public')); app.get('/index.htm', function(req, res){res.sendFile(__dirname + "/" + "index.htm");})app.get('/process_get', function(req, res){// 输出 JSON 格式varresponse = {"first_name":req.query.first_name, "last_name":req.query.last_name}; console.log(response); res.end(JSON.stringify(response));})varserver = app.listen(8081, function(){varhost = server.address().addressvarport = server.address().portconsole.log("应用实例,访问地址为 http://%s:%s", host, port)})

执行以上代码:

node server.js
应用实例,访问地址为 http://0.0.0.0:8081

浏览器访问 http://127.0.0.1:8081/index.htm,如图所示:

现在你可以向表单输入数据,并提交,如下演示:


POST 方法

以下实例演示了在表单中通过 POST 方法提交两个参数,我们可以使用 server.js 文件内的 process_post 路由器来处理输入:

index.htm 文件代码:

<html><body><formaction="http://127.0.0.1:8081/process_post"method="POST">First Name: <inputtype="text"name="first_name"><br> Last Name: <inputtype="text"name="last_name"><inputtype="submit"value="Submit"></form></body></html>

server.js 文件代码:

varexpress = require('express');varapp = express();varbodyParser = require('body-parser'); // 创建 application/x-www-form-urlencoded 编码解析varurlencodedParser = bodyParser.urlencoded({extended: false})app.use(express.static('public')); app.get('/index.htm', function(req, res){res.sendFile(__dirname + "/" + "index.htm");})app.post('/process_post', urlencodedParser, function(req, res){// 输出 JSON 格式varresponse = {"first_name":req.body.first_name, "last_name":req.body.last_name}; console.log(response); res.end(JSON.stringify(response));})varserver = app.listen(8081, function(){varhost = server.address().addressvarport = server.address().portconsole.log("应用实例,访问地址为 http://%s:%s", host, port)})

执行以上代码:

$ node server.js应用实例,访问地址为 http://0.0.0.0:8081

浏览器访问 http://127.0.0.1:8081/index.htm,如图所示:

现在你可以向表单输入数据,并提交,如下演示:


文件上传

以下我们创建一个用于上传文件的表单,使用 POST 方法,表单 enctype 属性设置为 multipart/form-data。

index.htm 文件代码:

<html><head><title>文件上传表单</title></head><body><h3>文件上传:</h3>选择一个文件上传: <br/><formaction="/file_upload"method="post"enctype="multipart/form-data"><inputtype="file"name="image"size="50"/><br/><inputtype="submit"value="上传文件"/></form></body></html>

server.js 文件代码:

<pre>varexpress = require('express');varapp = express();varfs = require("fs"); varbodyParser = require('body-parser');varmulter = require('multer'); app.use(express.static('public'));app.use(bodyParser.urlencoded({extended: false}));app.use(multer({dest: '/tmp/'}).array('image')); app.get('/index.htm', function(req, res){res.sendFile(__dirname + "/" + "index.htm");})app.post('/file_upload', function(req, res){console.log(req.files[0]); // 上传的文件信息vardes_file = __dirname + "/" + req.files[0].originalname; fs.readFile(req.files[0].path, function(err, data){fs.writeFile(des_file, data, function(err){if(err){console.log(err); }else{response = {message:'File uploaded successfully', filename:req.files[0].originalname}; }console.log(response); res.end(JSON.stringify(response)); }); });})varserver = app.listen(8081, function(){varhost = server.address().addressvarport = server.address().portconsole.log("应用实例,访问地址为 http://%s:%s", host, port)})

执行以上代码:

$ node server.js
应用实例,访问地址为 http://0.0.0.0:8081

浏览器访问 http://127.0.0.1:8081/index.htm,如图所示:

现在你可以向表单输入数据,并提交,如下演示:


Cookie 管理

我们可以使用中间件向 Node.js 服务器发送 cookie 信息,以下代码输出了客户端发送的 cookie 信息:

express_cookie.js 文件代码:

// express_cookie.js 文件varexpress = require('express')varcookieParser = require('cookie-parser')varapp = express()app.use(cookieParser())app.get('/', function(req, res){console.log("Cookies: ", req.cookies)})app.listen(8081)

执行以上代码:

$ node express_cookie.js

现在你可以访问 http://127.0.0.1:8081 并查看终端信息的输出,如下演示:


相关资料

  • Express官网: http://expressjs.com/

  • Express4.x API 中文版: Express4.x API Chinese

  • Express4.x API:http://expressjs.com/zh-cn/4x/api.html

相关推荐

团队管理“布阵术”:3招让你的团队战斗力爆表!

为何古代军队能够以一当十?为何现代企业有的团队高效似“特种部队”,有的却松散若“游击队”?**答案正隐匿于“布阵术”之中!**今时今日,让我们从古代兵法里萃取3个核心要义,助您塑造一支战斗力爆棚的...

知情人士回应字节大模型团队架构调整

【知情人士回应字节大模型团队架构调整】财联社2月21日电,针对原谷歌DeepMind副总裁吴永辉加入字节跳动后引发的团队调整问题,知情人士回应称:吴永辉博士主要负责AI基础研究探索工作,偏基础研究;A...

豆包大模型团队开源RLHF框架,训练吞吐量最高提升20倍

强化学习(RL)对大模型复杂推理能力提升有关键作用,但其复杂的计算流程对训练和部署也带来了巨大挑战。近日,字节跳动豆包大模型团队与香港大学联合提出HybridFlow。这是一个灵活高效的RL/RL...

创业团队如何设计股权架构及分配(创业团队如何设计股权架构及分配方案)

创业团队的股权架构设计,决定了公司在随后发展中呈现出的股权布局。如果最初的股权架构就存在先天不足,公司就很难顺利、稳定地成长起来。因此,创业之初,对股权设计应慎之又慎,避免留下巨大隐患和风险。两个人如...

消息称吴永辉入职后引发字节大模型团队架构大调整

2月21日,有消息称前谷歌大佬吴永辉加入字节跳动,并担任大模型团队Seed基础研究负责人后,引发了字节跳动大模型团队架构大调整。多名原本向朱文佳汇报的算法和技术负责人开始转向吴永辉汇报。简单来说,就是...

31页组织效能提升模型,经营管理团队搭建框架与权责定位

分享职场干货,提升能力!为职场精英打造个人知识体系,升职加薪!31页组织效能提升模型如何拿到分享的源文件:请您关注本头条号,然后私信本头条号“文米”2个字,按照操作流程,专人负责发送源文件给您。...

异形柱结构(异形柱结构技术规程)

下列关于混凝土异形柱结构设计的说法,其中何项正确?(A)混凝土异形柱框架结构可用于所有非抗震和抗震设防地区的一般居住建筑。(B)抗震设防烈度为6度时,对标准设防类(丙类)采用异形柱结构的建筑可不进行地...

职场干货:金字塔原理(金字塔原理实战篇)

金字塔原理的适用范围:金字塔原理适用于所有需要构建清晰逻辑框架的文章。第一篇:表达的逻辑。如何利用金字塔原理构建基本的金字塔结构受众(包括读者、听众、观众或学员)最容易理解的顺序:先了解主要的、抽象的...

底部剪力法(底部剪力法的基本原理)

某四层钢筋混凝土框架结构,计算简图如图1所示。抗震设防类别为丙类,抗震设防烈度为8度(0.2g),Ⅱ类场地,设计地震分组为第一组,第一自振周期T1=0.55s。一至四层的楼层侧向刚度依次为:K1=1...

结构等效重力荷载代表值(等效重力荷载系数)

某五层钢筋混凝土框架结构办公楼,房屋高度25.45m。抗震设防烈度8度,设防类别丙类,设计基本地震加速度0.2g,设计地震分组第二组,场地类别为Ⅱ类,混凝土强度等级C30。该结构平面和竖向均规则。假定...

体系结构已成昭告后世善莫大焉(体系构架是什么意思)

实践先行也理论已初步完成框架结构留余后人后世子孙俗话说前人栽树后人乘凉在夏商周大明大清民国共和前人栽树下吾之辈已完成结构体系又俗话说青出于蓝而胜于蓝各个时期任务不同吾辈探索框架结构体系经历有限肯定发展...

框架柱抗震构造要求(框架柱抗震设计)

某现浇钢筋混凝土框架-剪力墙结构高层办公楼,抗震设防烈度为8度(0.2g),场地类别为Ⅱ类,抗震等级:框架二级,剪力墙一级,混凝土强度等级:框架柱及剪力墙C50,框架梁及楼板C35,纵向钢筋及箍筋均采...

梁的刚度、挠度控制(钢梁挠度过大会引起什么原因)

某办公楼为现浇钢筋混凝土框架结构,r0=1.0,混凝土强度等级C35,纵向钢筋采用HRB400,箍筋采用HPB300。其二层(中间楼层)的局部平面图和次梁L-1的计算简图如图1~3(Z)所示,其中,K...

死要面子!有钱做大玻璃窗,却没有钱做“柱和梁”,不怕房塌吗?

活久见,有钱做2层落地大玻璃窗,却没有钱做“柱子和圈梁”,这样的农村自建房,安全吗?最近刷到个魔幻施工现场,如下图,这栋5开间的农村自建房,居然做了2个全景落地窗仔细观察,这2个落地窗还是飘窗,为了追...

不是承重墙,物业也不让拆?话说装修就一定要拆墙才行么

最近发现好多朋友装修时总想拆墙“爆改”空间,别以为只要避开承重墙就能随便砸!我家楼上邻居去年装修,拆了阳台矮墙想扩客厅,结果物业直接上门叫停。后来才知道,这种配重墙拆了会让阳台承重失衡,整栋楼都可能变...

取消回复欢迎 发表评论: