前言:
起因,接手了一个四年前的老项目(2018年的),项目是前后端分离,并且是由前端用node解决的跨域问题。一个node小白,为了更好的了解项目的搭建以及线上部署,无奈踏上node的学习之旅。(PS:果然,自己欠下的技术债,还得自己来还╮(╯▽╰)╭)。
那么,这篇文章先从原理入手,了解一下基础知识,然后,再根据资料进行实践一下吧。那么,我们一起来看看,node中间层是怎样做的请求合并转发的?
中间层就是,前端–请求–>node.js----请求---->后端----响应---->node.js–数据处理–响应---->前端。这么一个流程,这个流程的好处就是当业务逻辑过多时,或者业务需求在不断变更的时候,前端不需要过多的去改变业务逻辑,与后端低耦合。前端即显示、渲染。后端获取和存储数据。中间层处理数据结构,返回给前端可用可渲染的数据结构
。
nodejs是起中间层的作用的,即根据客户端不同请求来做相应的处理或渲染页面,处理时可以是把获取的数据做简单的处理交由底层java那边做真正的数据持久化或数据更新,也可以是从底层获取数据做简单的处理返回给客户端。
通常,我们把web领域分为客户端和服务端,也就是前端和后端,这里的后端就包括了网关,静态资源,接口,缓存,数据库等。而中间层呢,就是在后端这里再抽离一层出来,在业务上处理和客户端衔接更紧密的部分,比如页面渲染(SSR),数据聚合,接口转发等等
。
跨域
问题;在线上环境下,我们可以利用代理,转发请求到多个服务端
(场景:后端使用java springboot开发多个微服务(这里没有使用sping cloud Eureka做服务管理与API协调),每个服务的IP一致,端口不一致);解决前端的跨域问题
,因为服务器端的请求是不涉及跨域的,跨域是对游览器的同源策略到导致的;减少前端的请求
。 抽象的理解:
要明白Node层为什么能实现跨域,首先要明白一个原理:跨域问题是游览器的同源策略的安全机制引起的
,服务器之间是不存在跨域问题的,这也不是说服务器之间没有安全机制,只是服务器之间的调用无论是通过http访问还是通过rpc调用都是协议层面的机制,并没有限制必须同源。这也就是Node层跨域的实质,我们把静态文件和Node中间层放在同一个域下,这样前端资源和Node层的通信不会受同源策略影响,然后,我们通过Node中间层把前端的资源请求转发到真实的请求地址,在通过中间层把请求返回的数据传给前端,这样就实现了此域跨彼域的串门操作。
使用express中间件multifetch可以将请求批量合并
使用express+http-proxy-middleware实现接口代理
不使用第三方模块,手动实现一个nodejs代理服务器,实现请求合并转发:
搭建http服务器,使用Node的http模块的createServer方法;
接收客户端发送的请求,就是请求报文,请求报文中包括请求行、请求头、请求体;
将请求报文发送到目标服务器,使用http模块的request方法。
第一步:http服务器搭建
const http = require("http");
const server = http.createServer();
server.on("request",(req,res)=>{
res.end("hello world")
})
server.listen(3000,()=>{
console.log("running");
})
第二步:接收客户端发送到代理服务器的请求报文
const http = require("http");
const server = http.createServer();
server.on("request",(req,res)=>{
// 通过req的data事件和end事件接收客户端发送的数据
// 并用Buffer.concat处理一下
//
let postbody = [];
req.on("data", chunk => {
postbody.push(chunk);
})
req.on("end", () => {
let postbodyBuffer = Buffer.concat(postbody);
res.end(postbodyBuffer)
})
})
server.listen(3000,()=>{
console.log("running");
})
这一步主要数据在客户端到服务器端进行传输时,在nodejs中需要用到buffer来处理一下。处理过程就是将所有接收的数据片段chunk塞到一个数组中,然后,将其合并到一起还原出源数据。合并方法需要用到Buffer.concat,这里不能使用加号,加号会隐式的将buffer转化为字符串,这种转化不安全。
第三步:使用http模块的request方法,将请求报文发送到目标服务器
第二步已经得到了客户端上传的数据,但是缺少请求头,所以在这一步,根据客户端发送的请求需要构造请求头,然后发送
const http = require("http");
const server = http.createServer();
server.on("request", (req, res) => {
var { connection, host, ...originHeaders } = req.headers;
var options = {
"method": req.method,
// 随表找了一个网站做测试,被代理网站修改这里
"hostname": "www.nanjingmb.com",
"port": "80",
"path": req.url,
"headers": { originHeaders }
}
//接收客户端发送的数据
var p = new Promise((resolve,reject)=>{
let postbody = [];
req.on("data", chunk => {
postbody.push(chunk);
})
req.on("end", () => {
let postbodyBuffer = Buffer.concat(postbody);
resolve(postbodyBuffer)
})
});
//将数据转发,并接收目标服务器返回的数据,然后转发给客户端
p.then((postbodyBuffer)=>{
let responsebody=[]
var request = http.request(options, (response) => {
response.on("data", (chunk) => {
responsebody.push(chunk)
})
response.on("end", () => {
responsebodyBuffer = Buffer.concat(responsebody)
res.end(responsebodyBuffer);
})
})
// 使用request的write方法传递请求体
request.write(postbodyBuffer)
// 使用end方法将请求发出去
request.end();
})
});
server.listen(3000, () => {
console.log("runnng");
})
在网上找的相关例子都是,代码片段,没有完整的项目,看的我云里雾里的(PS:也可能是我理解和动手能力太差了吧o(╥﹏╥)o)。翻了好多资料,还好找到两位大佬的博客(Keyon Y 和 jsliang),继续填坑。KeyonY大佬的Node中间实践,全系列有五篇,可以细细了解,并且附有node中间层项目,开箱即用,终于,满足了我动手小白的需求。jsliang的Node实践,是从0基础到实战企业官网,从最开始的到项目线上部署,大概也就几万字吧,包括后端部分,非常详细具体。
参考博客:
3-10 说说你理解的node 中间层怎样做的请求合并转发? https://www.cnblogs.com/ifon/p/15991399.html
两种简单的Node.js转发服务实现 https://zhuanlan.zhihu.com/p/392845487
使用Nodejs进行反向代理 https://blog.51cto.com/u_12879490/1921947
nodejs接口转发 https://blog.51cto.com/xutongbao/5432318
跨域解决方案之Node中间层 https://juejin.cn/post/6844903895030824974
node中间件接口转发,从此跨域问题无需再麻烦后端同学 https://juejin.cn/post/6844904151042752525