您当前的位置:首页 > 电脑百科 > 程序开发 > 编程百科

node http请求

时间:2023-05-22 14:27:53  来源:今日头条  作者:德育处主任pro

对于前端来说,网络请求主要就是用 ajax 的方式去处理。所以本文也会站在前端角度简单讲解 Node 中如何使用 http 模块。

前后端对接时,现在常用的请求方法有 GET、POST、PUT、PATCH、DELETE。当然,还有其他方法,但本文主要面向新手,希望能做到快速起步。所以本文只讲 GET 和 POST 这两种最最最常用的方法。

在敲代码前,你首先需要准备一个 编辑器(我用vs code)、浏览器、postman 还有安装好 Node.js 。

创建服务

Node.js 提供了 http 模块,可用于网络请求。

创建一个 js 文件,输入以下代码。(本例的文件命名为 index.js)

const http = require('http')

const server = http.createServer((res, req) => {
  req.end('hello world')
})

server.listen(8000, () => {
  console.log('http://localhost:8000')
})

解释:

  • Node.js 使用 commonjs 语法,所以引入 http 模块使用了 require 的方法。
  • http 模块有一个 createServer 方法,该方法的参数是一个函数,函数里又有2个参数,res 是前端发送请求带过来的信息;req 是后端返回信息给前端时的一些方法和属性的集合。
  • 通过 req.end 方法,可以返回一段字符串给前端。
  • 通过 listen 方法可以设置需要监听的端口号,第二个参数是一个函数,我在控制台里输出 http://localhost:8000 是方便启动服务后方便自己打开这个地址。

使用 Node.js 运行上面的代码:

node index.js

运行完上面的命令,控制台应该会输出 http://localhost:8000 ,此时打开浏览器,输入 http://localhost:8000 后页面上会出现 “hello world”,证明服务创建成功,并且可以访问了。

 

GET

其实上一步所用的也是 GET 方法来访问后端,但上一步并没有解析参数。

get 请求的参数通常是挂在 url 后面的,比如 http://localhost:8000?msg=hello

如果有参数,会用 ? 开始,然后使用 参数名=值 的写法。

如果有多个参数,会使用 & 将参数区分开来:

http://localhost:8000?key1=value1&key2=value2&key3=value3

在 Node.js 里,如果需要解析 url 的参数,可以使用 node:querystring 模块。

const http = require('http') // 引入 htpp 模块
const querystring = require('node:querystring') // 引入 node:querystring 模块解析url

const server = http.createServer((req, res) => {
  console.log('method: ', req.method) // 打印请求方法,GET

  const url = req.url
  console.log('url: ', url) // 打印被访问的url

  req.query = querystring.parse(url.split('?')[1]) // 通过 ? 问号 分隔参数,并使用 querystring.parse 解析问号后面的参数
  console.log('query: ', req.query) // 输出参数
  res.end(JSON.stringify(req.query)) // 将参数返回给前端
})

server.listen(8000, () => {
  console.log('http://localhost:8000')
})

执行上面的代码,并在浏览器访问 http://localhost:8000/?msg=123&name=leihou

在浏览器会显示出如下内容

 

解析:

  • req.url 可以获取到当前访问后端的 url 路径
  • url.split('?')[1] 使用字符串的方法根据 ? 进行切割,然后获取后面那段
  • 使用 querystring.parse 方法将参数转换成对象的形式
  • res.end 将参数返回给前端。
  • 前端在浏览器地址栏输入 http://localhost:8000/?msg=123&name=leihou 时,后端会把参数返回,前端在页面中渲染出返回的参数。

POST

POST 请求会被 GET 更安全,同时也更麻烦。不能直接在浏览器地址栏输入 url 请求。

你可以写一段前端代码,通过 ajax 的方式请求。但本文主要讲解 Node.js ,所以我还是建议你使用 postman 发起 POST 请求。因为 postman 无需你处理跨域等问题。

 

const http = require('http')
const server = http.createServer((req, res) => {
  if (req.method === 'POST') {
    // 数据格式
    console.log('content-type', req.headers['content-type'])
    // 接收数据
    let postData = ''
    req.on('data', chunk => {
      postData += chunk.toString()
    })
    req.on('end', () => {
      console.log(postData)
      res.end('hello world') // 在这里返回,因为是异步
    })
  }
})

server.listen(8000 () => {
  console.log('http://localhost:8000')
})

和 GET 不同,POST 接收数据需要用 req.on('data') 进行接收,用 req.on('end') 处理接收数据完成的操作。

在 Node.js 里除了接收数据外,其他用法和 GET 有点像。

最后在 postman 访问 http://localhost:8000 ,并在 Body 的 raw 里填写 JSON 数据

 

按下 Send 键后,控制台会输出 postman 发送过来的数据。

综合实例

如果理解了 GET 和 POST 请求的话,我们就可以尝试将这两个请求结合起来使用了。

const http = require('http')
const querystring = require('node:querystring')

const server = http.createServer((req, res) => {
  const method = req.method
  const url = req.url
  const path = url.split('?')[0]
  const query = querystring.parse(url.split('?')[1])

  // 设置返回格式 JSON
  res.setHeader('Content-type', 'Application/json') // 这里返回JSON。如果是 text/html 返回html

  // 返回的数据
  const resData = {
    method,
    url,
    path,
    query,
  }

  // 返回
  if (method === 'GET') {
    res.end(
      JSON.stringify(resData)
    )
  }
  if (method === 'POST') {
    let postData = ''
    req.on('data', chunk => {
      postData += chunk.toString()
    })
    req.on('end', () => {
      resData.postData = JSON.parse(postData)
      // 返回
      res.end(
        JSON.stringify(resData)
      )
    })
  }
})

server.listen(8000, () => {
  console.log('http://localhost:8000')
})

上面的代码最主要是判断 method 是 GET 还是 POST ,因为两者接收数据的方式是不一样的。

你可以运行上面的代码,尝试在浏览器和 postman 各发送一下 GET 和 POST 测试一下。



Tags:node http   点击:()  评论:()
声明:本站部分内容及图片来自互联网,转载是出于传递更多信息之目的,内容观点仅代表作者本人,不构成投资建议。投资者据此操作,风险自担。如有任何标注错误或版权侵犯请与我们联系,我们将及时更正、删除。
▌相关推荐
node http请求
对于前端来说,网络请求主要就是用 ajax 的方式去处理。所以本文也会站在前端角度简单讲解 Node 中如何使用 http 模块。前后端对接时,现在常用的请求方法有 GET、POST、PUT、P...【详细内容】
2023-05-22  Search: node http  点击:(121)  评论:(0)  加入收藏
▌简易百科推荐
即将过时的 5 种软件开发技能!
作者 | Eran Yahav编译 | 言征出品 | 51CTO技术栈(微信号:blog51cto) 时至今日,AI编码工具已经进化到足够强大了吗?这未必好回答,但从2023 年 Stack Overflow 上的调查数据来看,44%...【详细内容】
2024-04-03    51CTO  Tags:软件开发   点击:(6)  评论:(0)  加入收藏
跳转链接代码怎么写?
在网页开发中,跳转链接是一项常见的功能。然而,对于非技术人员来说,编写跳转链接代码可能会显得有些困难。不用担心!我们可以借助外链平台来简化操作,即使没有编程经验,也能轻松实...【详细内容】
2024-03-27  蓝色天纪    Tags:跳转链接   点击:(13)  评论:(0)  加入收藏
中台亡了,问题到底出在哪里?
曾几何时,中台一度被当做“变革灵药”,嫁接在“前台作战单元”和“后台资源部门”之间,实现企业各业务线的“打通”和全域业务能力集成,提高开发和服务效率。但在中台如火如荼之...【详细内容】
2024-03-27  dbaplus社群    Tags:中台   点击:(9)  评论:(0)  加入收藏
员工写了个比删库更可怕的Bug!
想必大家都听说过删库跑路吧,我之前一直把它当一个段子来看。可万万没想到,就在昨天,我们公司的某位员工,竟然写了一个比删库更可怕的 Bug!给大家分享一下(不是公开处刑),希望朋友们...【详细内容】
2024-03-26  dbaplus社群    Tags:Bug   点击:(5)  评论:(0)  加入收藏
我们一起聊聊什么是正向代理和反向代理
从字面意思上看,代理就是代替处理的意思,一个对象有能力代替另一个对象处理某一件事。代理,这个词在我们的日常生活中也不陌生,比如在购物、旅游等场景中,我们经常会委托别人代替...【详细内容】
2024-03-26  萤火架构  微信公众号  Tags:正向代理   点击:(11)  评论:(0)  加入收藏
看一遍就理解:IO模型详解
前言大家好,我是程序员田螺。今天我们一起来学习IO模型。在本文开始前呢,先问问大家几个问题哈~什么是IO呢?什么是阻塞非阻塞IO?什么是同步异步IO?什么是IO多路复用?select/epoll...【详细内容】
2024-03-26  捡田螺的小男孩  微信公众号  Tags:IO模型   点击:(9)  评论:(0)  加入收藏
为什么都说 HashMap 是线程不安全的?
做Java开发的人,应该都用过 HashMap 这种集合。今天就和大家来聊聊,为什么 HashMap 是线程不安全的。1.HashMap 数据结构简单来说,HashMap 基于哈希表实现。它使用键的哈希码来...【详细内容】
2024-03-22  Java技术指北  微信公众号  Tags:HashMap   点击:(11)  评论:(0)  加入收藏
如何从头开始编写LoRA代码,这有一份教程
选自 lightning.ai作者:Sebastian Raschka机器之心编译编辑:陈萍作者表示:在各种有效的 LLM 微调方法中,LoRA 仍然是他的首选。LoRA(Low-Rank Adaptation)作为一种用于微调 LLM(大...【详细内容】
2024-03-21  机器之心Pro    Tags:LoRA   点击:(12)  评论:(0)  加入收藏
这样搭建日志中心,传统的ELK就扔了吧!
最近客户有个新需求,就是想查看网站的访问情况。由于网站没有做google的统计和百度的统计,所以访问情况,只能通过日志查看,通过脚本的形式给客户导出也不太实际,给客户写个简单的...【详细内容】
2024-03-20  dbaplus社群    Tags:日志   点击:(4)  评论:(0)  加入收藏
Kubernetes 究竟有没有 LTS?
从一个有趣的问题引出很多人都在关注的 Kubernetes LTS 的问题。有趣的问题2019 年,一个名为 apiserver LoopbackClient Server cert expired after 1 year[1] 的 issue 中提...【详细内容】
2024-03-15  云原生散修  微信公众号  Tags:Kubernetes   点击:(6)  评论:(0)  加入收藏
相关文章
    无相关信息
站内最新
站内热门
站内头条