3

我正在尝试在 Vue 3 应用程序中在运行时访问环境变量。我正在使用 vitejs 进行捆绑。

应用程序部署在 AKS 上,值存储为 Kubernetes 机密。

我按照此处此处的说明进行操作

我有一个 .env 文件,其中包含我要公开的环境变量:

VITE_OKTA_CLIENT=$VITE_OKTA_CLIENT
VITE_OKTA_ISSUER=$VITE_OKTA_ISSUER

$VITE_OKTA_ISSUER是我的 k8s pod 中具有实际值的 env 变量。

我尝试使用这样的变量:

import.meta.env.VITE_OKTA_CLIENT
import.meta.env.VITE_OKTA_ISSUER

进口的价值是未定义的

这就是我的 vitejs 配置的样子:

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import vueI18n from '@intlify/vite-plugin-vue-i18n'
const path = require('path')

// https://vitejs.dev/config/
export default defineConfig({
  resolve: {
    alias: {
      '@': path.resolve(__dirname, '/src'),
      '@okta/okta-auth-js': '@okta/okta-auth-js/dist/okta-auth-js.umd.js'
    }
  },
  optimizeDeps: {
    include: [
      '@vue/apollo-composable'
    ]
  },
  plugins: [
    vue(),
    vueI18n({
      include: path.resolve(__dirname, './src/locales/**')
    })
  ]
})

在我的 Kubernetes 配置文件中,我像这样引用 env:

spec:
      containers:
      - name: webapp
        env:
          - name: VITE_ROUTER_BASE
            value: /
          - name: VITE_OKTA_CLIENT
            valueFrom:
              secretKeyRef:
                name: testsecret
                key: VITE_OKTA_CLIENT
          - name: VITE_OKTA_ISSUER
            valueFrom:
              secretKeyRef:
                name: testsecret
                key: VITE_OKTA_ISSUER

我的配置是否缺少任何东西?还是有更好的方法来做到这一点?

4

0 回答 0