【node进阶】深度解析express框架---编写接口|解决跨域问题---上篇

简介: 【node进阶】深度解析express框架---编写接口|解决跨域问题---上篇

学前先知:req.body | req.query | req.params


想要从web的后台中获取接口的数据,传参是必不可少的,后台想要接收前台传来的数据需要借助一些内置的方法:


req.body


express框架中,用req.body接收post客户端的数据,该属性主要用于post()方法时传递参数使用,用法最广泛,在你想使用这个方法的时候必须要导入第三方中间件body-parser.


演示代码:



const express = require('express')
const app = express()
const body_parser = require('body-parser')
app.use(body_parser.urlencoded({extended : false}))
app.post('/user',(req,res)=>{
    console.log(req.body);   //[Object: null prototype] { name: 'james', age: '37', gender: '男' }
    res.send('ok')
})
app.listen(80,()=>{
    console.log('http://127.0.0.1');
})


这里使用了postman测试工具,打印出来的req.body为前台传给后台的参数,后台告诉了前台接收到了参数,打印了ok


req.query


req.query用来获取get方法传递的参数,在这里就无需载入中间件了。


演示代码:



const express = require('express');
const app = express();
// 测试地址:http://127.0.0.1/user/?name=james
app.get('/user', function(req, res){
    let param = req.query.name;  
    console.log(param) //james
  res.send('ok');
});
app.listen(80,()=>{
    console.log('http://127.0.0.1');
})


在postman中测试地址为http://127.0.0.1?name=james,通过req.query取到了一个对象{name : 'james'},随后拿到name属性即可


req.params


有时候我们遇到的地址栏可能会是这种形式:http://127.0.0.1/user/1,这时候就需要我们的req.params去接收前台传来的参数


演示代码:



const express = require('express')
const app = express()
app.get('/user/:id', function(req, res){
    let param = req.params.id;  //1
    console.log(param)
  res.send('ok');
});
app.listen(80,()=>{
    console.log('http://127.0.0.1');
})


在postman中自创地址http://127.0.0.1/user/1,通过req.query获取到一个对象{id:1},随后取出对象中的属性即可


使用express编写接口


  • 创建基本的服务器



const express = require('express')
//创建express实例
const app = express()
//在这里写下你的业务代码...
//调用app.listen 方法,指定端口号并启动web服务器
app.listen('80',()=>{
    console.log('http://127.0.0.1');
})


  • 创建api路由模块



const express = require('express')
const apiRouter = express.Router()
//在这里写下你所创建的路由...
//将apiRouter导出为一个模块
module.exports = apiRouter


将模块导入创建基本服务的文件中



const express = require('express')
const app = express()
const apiRouter = require('./16.apiRouter')
app.use('/api',apiRouter)
app.listen('80',()=>{
    console.log('http://127.0.0.1');
})


  • 编写get接口



apiRouter.get('/get',(req,res)=>{
    // 通过 req.query 获取客户端通过查询字符串,发送到服务器的数据
    const query = req.query
    // 调用 res.send() 方法,向客户端响应处理的结果
    res.send({
        status : 0, // 0 表示处理成功,1 表示处理失败
        msg : 'GET请求成功!',  // 状态的描述
        data : query // 需要响应给客户端的数据
    })
})


  • 编写post接口



apiRouter.post('/post',(req,res)=>{
    // 通过 req.body 获取请求体中包含的 url-encoded 格式的数据
    const body = req.body
    // 调用 res.send() 方法,向客户端响应结果
    res.send({
        status : 0, 
        msg : 'post请求成功!',
        data : body
    })
})


注意:如果要获取 URL-encoded 格式的请求体数据,须配置中间件:app.use(express.urlencoded({ extended: false }))


  • 编写delete接口



// 定义 DELETE 接口
apiRouter.delete('/delete', (req, res) => {
    res.send({
      status: 0,
      msg: 'DELETE请求成功',
    })
  })


跨域问题


什么是跨域


我们刚才编写的接口,存在一个很严重的问题:不支持跨域请求。那么什么是跨域(CORS)呢?


当一个请求url的协议、域名、端口号三者之间任意一个与当前页面url不同即为跨域.

举个例子:我当前的url为:http://127.0.0.1/user,但是我想访问url为https://127.0.0.1/admin中的数据,我能访问的到吗?显然是不可能的,这就产生了跨域问题!


为什么会产生跨域问题


出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。


可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。

所谓同源(即指在同一个域)就是两个页面具有相同的协议(protocol),主机(host)和端口号(port)。


相关文章
|
15天前
|
开发框架 JavaScript 安全
js开发:请解释什么是Express框架,以及它在项目中的作用。
【4月更文挑战第24天】Express是Node.js的Web开发框架,简化路由管理,支持HTTP请求处理。它包含中间件系统用于日志、错误处理和静态文件服务,集成多种模板引擎如EJS、Jade、Pug。框架还提供安全中间件提升应用安全,并具有良好的可扩展性,便于项目功能扩展和开发效率提升。
25 3
|
11天前
|
存储 前端开发 中间件
🚀React+Node全栈无死角解析,吃透文件上传的各个场景
🚀React+Node全栈无死角解析,吃透文件上传的各个场景
|
9天前
|
JavaScript 网络协议 数据处理
Node.js中的Buffer与Stream:深入解析与使用
【4月更文挑战第30天】本文深入解析了Node.js中的Buffer和Stream。Buffer是处理原始数据的全局对象,适用于TCP流和文件I/O,其大小在V8堆外分配。创建Buffer可通过`alloc`和`from`方法,它提供了读写、切片和转换等操作。Stream是处理流式数据的抽象接口,分为可读、可写、双工和转换四种类型,常用于处理大量数据而无需一次性加载到内存。通过监听事件和调用方法,如读取文件的可读流示例,可以实现高效的数据处理。理解和掌握Buffer及Stream能提升Node.js应用的性能。
|
9天前
|
开发框架 JavaScript 中间件
深入探索Node.js的Express框架:使用与中间件详解
【4月更文挑战第30天】本文深入探讨了Node.js的Express框架,介绍了其作为Web开发的强大工具,主要聚焦于基本使用和中间件。Express是基于Node.js的Web应用框架,用于构建高效的应用和API。文章详细讲解了如何安装Express,创建简单应用,以及中间件的工作原理和应用,包括中间件的顺序、错误处理和挂载位置。此外,还提到了使用第三方中间件扩展功能。理解Express基础和中间件对于开发高质量Web应用至关重要。
|
9天前
|
JavaScript 前端开发 开发者
Node.js的包管理和npm工具深度解析
【4月更文挑战第30天】本文深入解析Node.js的包管理和npm工具。包管理促进代码复用和社区协作,包包含元数据描述文件`package.json`和入口文件。npm提供搜索、安装、发布等功能,通过命令行进行操作,如`install`、`search`、`uninstall`。npm支持版本控制、全局安装、脚本定义及私有仓库。理解和熟练运用npm能提升Node.js开发效率。
|
10天前
|
JavaScript 大数据 开发者
Node.js的异步I/O模型与事件循环:深度解析
【4月更文挑战第29天】本文深入解析Node.js的异步I/O模型和事件循环机制。Node.js采用单线程与异步I/O,遇到I/O操作时立即返回并继续执行,结果存入回调函数队列。事件循环不断检查并处理I/O事件,通过回调函数通知结果,实现非阻塞和高并发。这种事件驱动编程模型简化了编程,使开发者更专注业务逻辑,为高并发场景提供高效解决方案。
|
11天前
初识express框架
初识express框架
|
14天前
|
JavaScript 前端开发 Linux
|
2天前
|
Java Android开发
Android12 双击power键启动相机源码解析
Android12 双击power键启动相机源码解析
11 0
|
2天前
|
分布式计算 Java API
Java8 Lambda实现源码解析
Java8的lambda应该大家都比较熟悉了,本文主要从源码层面探讨一下lambda的设计和实现。