html中获取容器部署的环境变量

在云端环境下,标准产品的租户定制,可以通过登录人获取租户信息,再获取租户配置,进行项目的功能或ui调整。

如果是非云端的组件型产品------既无用户也无租户,却又有不同属地特殊要求,如何知道该项目部署于哪个属地就成为一个比较头疼的问题。

一个比较轻量级的方案是,容器部署时,传入属地信息。比如web项目,在项目中维护一个nginx配置文件模板,编写docker-entrypoint.sh文件用于容器启动:

sh 复制代码
envsubst '$TENANT' < /etc/nginx/conf.d/default.conf.template > /etc/nginx/conf.d/default.conf


# 启动 nginx
exec nginx -g "daemon off;"

在启动时,通过环境变量将属地信息注入nginx配置文件中:

bash 复制代码
server {
    ...
    location / {
      ...
      sub_filter "{tenant}" "${TENANT}";
    }
}

envsubst

envsubst 是 GNU gettext 工具集中的一个命令,功能是扫描文本中的环境变量占位符(如 ${VAR_NAME}),并替换为当前系统中对应环境变量的实际值

例如,若存在文本 Hello ${NAME}!,且环境变量 NAME="Docker",执行 envsubst 后会输出 Hello Docker!

sub_filter

sub_filter 的语法是 sub_filter "搜索字符串" "替换字符串",其中 "替换字符串" 可以是:

markdown 复制代码
-   固定文本(如 `"123"`、`"固定内容"`)
-   Nginx 内置变量(如 `$remote_addr`、`$time_local`)
-   变量与文本的组合(如 `"时间:$time_local-123"`)

这种替换对所有匹配 sub_filter_types 配置的响应类型生效(默认仅 text/html

在html中接收环境变量

html中可以通过{tenant}模板字符接收nginx替换后的变量,再将其存入localStorage中

xml 复制代码
<!doctype html>
<html lang="en">
 <head>
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

   <title>demo</title>
   <script>
     window.localStorage.setItem('tenant', '{tenant}');
   </script>
 </head>
 <body>
  
 </body>
</html>

这种方式在一定程度上能够防止变量篡改------每次访问该html,都会被nginx重新注入变量

相关推荐
Java水解4 分钟前
深入掌握 ExcelJS:Node.js 中强大的 Excel 操作库
后端·excel
葡萄城技术团队10 分钟前
SpreadJS 纯前端表格控件:破解中国式复杂报表技术文档
前端
Humbunklung11 分钟前
C# 压缩解压文件的常用方法
前端·c#·压缩解压
Java水解12 分钟前
深度解析 Spring MVC `@ModelAttribute` 注解
后端·spring
通往曙光的路上16 分钟前
时隔一天第二阶段他来了 html!!!!!!!!!!!
前端·html
红尘客栈227 分钟前
Ansible 入门到实战:自动化运维的瑞士军刀
运维·自动化·ansible
爱吃甜品的糯米团子33 分钟前
CSS图片背景属性
前端·css
调试人生的显微镜37 分钟前
Python 爬虫 HTTPS 实战,requests httpx aiohttp 抓取技巧、证书问题与抓包调试全流程
后端
程序猿DD38 分钟前
Spring Boot 4 与 Spring Framework 7 全面解析:新特性、升级要点与实战指南
java·spring boot·后端
雮尘39 分钟前
一文读懂Android Fragment栈管理
android·前端