bff.proxy#

• 类型： Record<string, string>
• 默认值： {}

通过简单配置，Modern.js 可以将发送给 BFF server 的请求，自动代理到指定的服务上。

在 modern.server-runtime.config.js 中加入以下配置；即可开启代理：

import { defineConfig } from '@modern-js/app-tools/server';
export default defineConfig({
  bff: {
    proxy: {
      '/api': 'https://cnodejs.org',
    },
  },
});

假设 Modern.js BFF server 的地址是 localhost:8080，所有以 api 开头的请求都会被代理到 https://cnodejs.org，如 localhost:8080/api/v1/topics 的请求会被代理到 https://cnodejs.org/api/v1/topics。

这里还可以进行路径重写，如将发送到 localhost:8080/api/topics 的请求代理到 https://cnodejs.org/api/v1/topics。

import { defineConfig } from '@modern-js/app-tools/server';
export default defineConfig({
  bff: {
    proxy: {
      '/api': {
        target: 'https://cnodejs.org',
        pathRewrite: { '/api/topics': '/api/v1/topics' },
        changeOrigin: true,
      },
    },
  },
});

与 dev.proxy 不同，本节所介绍的代理只作用于进入 BFF/API 服务的请求；同时，这一配置不但可以在开发环境中使用，在生产环境中也会代理相应的请求。

BFF Proxy 使用了强大的 http-proxy-middleware，如果需要更多高级的用法， 可以查看它的文档。

常见用法#

解决接口跨域问题#

在项目开发过程中，因为 web 页面和接口服务不是部署在同一个域名下，常常会遇到跨域问题。 解决跨域问题的方式有很多，在这里我们使用 bff.proxy 可以轻松解决跨域问题。

如下所示，在 modern.server-runtime.config.ts 中，写入如下配置；我们将所有 web 页面发送到同域的以 /api 开头的请求代理到另一个域名的服务上。

export default defineServerConfig({
  bff: {
    proxy: {
      '/api': 'https://cnodejs.org',
    },
  },
};