Koa代理问题

背景介绍:Koa.js 是一个流行的 Node.js 后端框架,它旨在提供一种更简单、更强大、更有表现力的方式来构建 Web 应用程序和 API。Koa.js 是 Express.js 的继任者,由 Express.js 的团队创建,并在许多方面提供了更现代和强大的工具。

在聊Koa的代理问题之前我先介绍一下起因。我司在做一个多项目的整合工作,就是把原先多个项目打包成一个。这就涉及到请求工具类的整合(比如Axios),每个子项目之前分别存在自己的接口地址比如A项目接口地址www.aaa.com, B项目接口地址www.bbb.com 。这里我是通过为api加不同的前缀来进行区分。

在开发阶段我们可以通过webpack-dev-server启动代理服务来搞定

js 复制代码
  devServer: {
    proxy: {
      // 设置服务器代理
      '/a': {
        target: `http://www.aaa.com`
      },
      '/b': {
        target: 'http://www.bbb.com',
      }
    }
  }

但是如果是生产环境我们应该怎么处理呢?我们可以选择通过第三方工具进行代理,如:nginx。笔者这里使用Koajs进行代理,原因是项目内部本身就存在Koa项目服务所以不需要引入额外的工具来完成代理功能。 下面我们来创建一个简单的koa应用

一、安装

Koa 依赖 node v7.6.0 或 ES2015及更高版本和 async 方法支持.

你可以使用自己喜欢的版本管理器快速安装支持的 node 版本:

ruby 复制代码
$ npm init -y
$ npm i koa
$ node my-koa-app.js

编写项目代码

js 复制代码
const Koa = require('koa');
const bodyParser = require('koa-bodyparser');
const App = new Koa();

App.use(bodyParser());

App.use(async ctx=>{
    ctx.body=ctx.request.body
})

App.listen(3000)

代码运行良好,为了进行代理 这里采用 http-proxy-middleware

js 复制代码
const Koa = require('koa');
const bodyParser = require('koa-bodyparser');
const { createProxyMiddleware } = require('http-proxy-middleware');
const App = new Koa();

const proxyMiddleware = createProxyMiddleware('/a', {
    target: 'https://v1.jinrishici.com/siji.txt',
    changeOrigin: true,
    pathRewrite: {
        '^/a': '/', // rewrite path
    },
  })

App.use(proxyMiddleware);
App.use(bodyParser());

App.use(async ctx=>{
    ctx.body=ctx.request.body
})

App.listen(3000)

不出意外的报错了,这是因为Koa 中没有 next,所以肯定会报,那要怎么解决?这里我引入了插件koa2-connect来兼容Koa。

这里采用的诗词接口是**v1.jinrishici.com/siji.txt** 代码范例如下:

js 复制代码
const Koa = require('koa');
const c2k = require('koa2-connect');
const bodyParser = require('koa-bodyparser');
const { createProxyMiddleware } = require('http-proxy-middleware');
const App = new Koa();

const proxyMiddleware = createProxyMiddleware('/a', {
    target: 'https://v1.jinrishici.com/siji.json',
    changeOrigin: true,
    secure: false,
    pathRewrite: {
        '^/a': '', // rewrite path
    },
  })

  App.use(bodyParser());
  App.use(c2k(proxyMiddleware));

App.use(async ctx=>{
    ctx.body=ctx.request.body
})

App.listen(3000)

PS 注意之前本人在项目中遇到过该方法报错的问题本人目前无法通过demo重现,项目中的解决方式是将App.use(bodyParser())放在proxyMiddleware之后

相关推荐
程序媛刘刘3 分钟前
uniappx 使用体验
java·服务器·前端
coder阿龙7 分钟前
【UNIAPP】获取视频的第一帧作为封面(基于视频URL,Canvas)复制即用
前端·uni-app·音视频
蘑菇王8 分钟前
无需打包构建?ESM Bundleless 开发的探索与实践
前端·javascript
只会写Bug的程序员12 分钟前
面试之《TypeScript泛型》
前端·面试·typescript
宇寒风暖23 分钟前
HTML嵌入CSS样式超详解(尊享)
前端·css·笔记·学习·html
秋天的一阵风27 分钟前
‌ES Module 都过十岁生日了,你还不了解它的运行原理吗?
前端·javascript·面试
FreeCultureBoy30 分钟前
本地运行LLM的实用指南
前端
二川bro1 小时前
前端项目Axios封装Vue3详细教程(附源码)
前端
古柳_Deserts_X1 小时前
看看 ManusAI 相关网站长啥样。通过「新词新站」思路挖到720K月访问、140K月访问的两个新站
前端·程序员·创业
Moment1 小时前
前端白屏检测SDK:从方案设计到原理实现的全方位讲解 ☺️☺️☺️
前端·javascript·面试