Spring Boot 从Sping Boot 服务的React App访问ENV变量

n9vozmp4  于 2023-06-22  发布在  Spring
关注(0)|答案(1)|浏览(103)

我有一个Sping Boot 应用程序,捆绑了React前端。它配置了maven前端插件来构建react应用程序,并将其放在/public中,以便由Sping Boot 提供服务。所有内容都 Package 在一个.jar中,并部署到k8s集群中,其中env变量被单独处理并由Sping Boot 读取。
我见过其他解决方案like this one讨论创建一个端点来公开ENV变量。
问题是我正在为运行时集成提供Web组件。因此后端的URL对于前端是未知的(取决于环境)。通常情况下,你总是从react应用程序调用http://localhost:8080来访问spring Boot 控制器,但在我的情况下不是这样,因为web组件将从主机web应用程序调用spring boot端点。
如何直接从react代码访问ENV变量?或者我可以从spring Boot ,将ENV变量保存到react应用程序所在的同一个目录中,然后以某种方式读取该文件吗?

bihw5rsg

bihw5rsg1#

经过进一步的调查,我在这里添加我的解决方案,以防它帮助别人。

基础URL

如果您需要特定于BaseURL环境,则无法使用here描述的控制器解决方案。你需要在react中解决这个问题,一旦你有了它,你就可以使用Sping Boot Controller解决方案来获取其余的ENV变量

import { isStringNotBlank } from '../utils/utils';

export const isAbsoluteUrl = (urlString?: string) =>
  urlString?.indexOf('http://') === 0 || urlString?.indexOf('https://') === 0;

const getHostBaseUrl = () => {
  const urlString = document.currentScript?.getAttribute('src');
  return isStringNotBlank(urlString) && isAbsoluteUrl(urlString)
    ? new URL(urlString).origin
    : '';
};

export interface RuntimeConfig {
  baseUrl: string;
}

export const config: RuntimeConfig = {
  baseUrl: `${getHostBaseUrl()}/api`,
} as const;

// eslint-disable-next-line no-console
console.log('config', config);

说明

本质上,我们获取当前源(js文件)的URL,并从那里获取基本URL。在我的例子中,基本URL足以调用后端。
如果这对你来说还不够,也许你可以用它来测试你的应用部署在哪个环境中(dev,test,acpt,prod),并查找正确的baseURL(你必须在react中硬编码这个Map)。
一旦你有了基本URL,你就可以调用Sping Boot 应用程序端点来获取ENV变量,如this solution中所述。

相关问题