本文主要是介绍express/koa2中使用http-proxy-middleware代理转发后端接口解决跨域问题,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
由于后端接口没有设置允许跨域,故前端需要自己解决,如果前端项目是node起的服务,可以使用express/koa2框架,配合http-proxy-middleware中间件转发后端接口
express中:
1.先安装依赖
npm i http-proxy-middleware -D
2.设置代理,可配置多条
var app = express();// 设置反向代理解决跨域,类似nginx的反向代理,参考https://github.com/chimurai/http-proxy-middleware/tree/2.x?tab=readme-ov-file
var {createProxyMiddleware} = require('http-proxy-middleware');//http-proxy-middleware是使用http-proxy封装的,基于body-parser上封装的,必须放在 json() 之前
app.use(createProxyMiddleware('/rmt', { target: 'http://14.22.13.13:10000/rmt', changeOrigin: true, }));
app.use(createProxyMiddleware('/vlpr',{target: 'http://127.0.0.1:8080/vlpr', changeOrigin: true}));//请求http://localhost:3000/vlpr相当于请求http://127.0.0.1:8080/vlpr
app.use(createProxyMiddleware('/admin',{target: 'http://116.162.165.193:8081/admin',// 目标服务器 hostchangeOrigin: false,// 默认false,是否需要改变原始主机头为目标URL// ws: true,// 是否代理websockets// pathRewrite: {// '^/api/old-path': '/api/new-path',// 重写请求,比如我们源访问的是/api/old-path,那么请求会被解析为/api/new-path// '^/api/remove/path': '/path'// },// router: {// 'dev.localhost:3000' : 'http://localhost:8000'// 如果请求主机 == 'dev.localhost:3000',重写目标服务器 'dev.localhost:3000' 为 'http://localhost:8000'// }// logger: console,//打印日志// pathFilter: '**',//匹配所有
}));//请求http://localhost:3000/admin相当于请求http://116.162.165.193:8081/adminapp.use(express.json());//注意如果有用到这个,需要放在http-proxy-middleware后面,不然会报错404,笔者已踩坑//...其他代码...
koa2中:
1.安装依赖:
npm i http-proxy-middleware koa2-connect -D
2.设置代理,可配置多条
// koa中使用http-proxy-middleware会报错参考https://blog.csdn.net/fxss5201/article/details/122659412
// 设置反向代理解决跨域,类似nginx的反向代理,参考https://www.cnblogs.com/zhaoweikai/p/9969282.html
// 设置反向代理解决跨域,类似nginx的反向代理,参考https://github.com/chimurai/http-proxy-middleware/tree/2.x?tab=readme-ov-file
const k2c = require("koa2-connect");
var {createProxyMiddleware} = require('http-proxy-middleware');//http-proxy-middleware是使用http-proxy封装的,基于body-parser上封装的,必须放在 json() 之前
app.use(async (ctx, next) => {if (ctx.url.startsWith("/rmt")) {ctx.respond = false;await k2c(createProxyMiddleware({target: "http://14.22.13.13:10000/rmt",changeOrigin: true}))(ctx, next);}if (ctx.url.startsWith("/vlpr")) {ctx.respond = false;await k2c(createProxyMiddleware({target: "http://127.0.0.1:8080/vlpr",changeOrigin: true}))(ctx, next);}await next();
});app.use(bodyparser({enableTypes:['json', 'form', 'text']
}))
app.use(json())
这篇关于express/koa2中使用http-proxy-middleware代理转发后端接口解决跨域问题的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!