nodejs 代理中间件 http-proxy-middleware

在下月亮有何贵干

已于 2022-05-18 12:49:41 修改

阅读量1.9k

点赞数 1

分类专栏： nodejs 文章标签：中间件 http javascript node.js

于 2022-05-18 12:47:15 首次发布

本文链接：https://blog.csdn.net/weixin_43877799/article/details/124839382

版权

nodejs 专栏收录该内容

20 篇文章 1 订阅

订阅专栏

前言

平时用 express 编写服务端比较多，介绍一下代理中间件 http-proxy-middleware ，结合 express 使用非常方便，我们可以将请求转发去别的地址进行反馈。

本文做简单使用记录与案例，想了解更多配置可以移步npm：http-proxy-middleware。

服务端

我们引入了 cors 解决一下跨域问题，因为今天研究的是服务端的请求代理，所以我们不要把关注点放在解决前后端跨域的代理上。
可以将 config 单独编写为一个文件导入，这里为了方便阅读就写在这里了。
Object.entries(config.proxy).forEach(([path, pathConfig]) 这里的 path 与 pathConfig 是 proxy 里面的所有键值对，也就是代理路径和代理配置，遍历对象的语法不理解可以阅读：js 遍历对象方法大全。

import {createProxyMiddleware} from 'http-proxy-middleware'
import express from 'express'
import cors from 'cors'

const app = new express()
app.use(cors())

// 可以将 config 单独编写为一个文件导入，这里为了方便阅读就写在这里了
const config = {
    proxy: {
        '/api': {
            'target': 'https://unidemo.dcloud.net.cn/api/news',
            'changeOrigin': true,
            'pathRewrite': {'^/api': ''},
        }
    }
}

if (config.proxy) {
    // path与pathConfig是proxy里面的所有键值对，也就是代理路径和代理配置
    Object.entries(config.proxy).forEach(([path, pathConfig]) => {
        const target = pathConfig.target;
        if (target) {
            app.use(
                path,
                createProxyMiddleware(path, pathConfig),
            );
        }
    });
}

app.listen(3000, () => {
    console.log('服务器开启')
})

$ node app.js
服务器开启中

客户端

这里请求服务端地址的 /api ，可以发现我们并没有编写该服务，但是却得到了数据，就是因为服务端将 /api 请求转发到了 https://unidemo.dcloud.net.cn/api/news。
fetch 请求使用语法不会请阅读这篇：fetch异步请求使用详解。

<body>
<script>
    const getData = async () => {
        const response = await fetch('http://localhost:3000/api')
        const data = await response.json()
        console.log(data)
    }
    getData()
</script>
</body>

请添加图片描述

尾言

如果觉得文章对你有帮助的话，欢迎点赞收藏哦，有什么错误或者意见建议也可以留言，感谢~

在下月亮有何贵干

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
nodejs 代理中间件 http-proxy-middleware

平时用 express 编写服务端比较多，介绍一下代理中间件 http-proxy-middleware ，结合 express 使用非常方便，我们可以将请求转发去别的地址进行反馈。
复制链接

扫一扫