不要在main.bundle.js中显示API访问密钥

Question

可以看到访问键

在我在Angular 6中的应用程序中，我使用了两个API，它们都需要Key或Token来授予可用的执行方法。

我在src/environmets/environment.prod.ts内创建了密钥。

我的 angular.json ：

                "configurations": {
                    "production": {
                        "fileReplacements": [
                            {
                                "replace": "src/environments/environment.ts",
                                "with": "src/environments/environment.prod.ts"
                            }
                        ],
                        "optimization": true,
                        "outputHashing": "all",
                        "sourceMap": false,
                        "extractCss": true,
                        "namedChunks": false,
                        "aot": true,
                        "extractLicenses": true,
                        "vendorChunk": false,
                        "buildOptimizer": true
                    }
                }

environment.prod.ts：

export const environment = {
    production: false,
    hmr: false,
    firebase: {
        apiKey: 'AIzaSyD8-dfxdfxdfxdf3242342342',
        authDomain: 'dfdfd-med.firebaseapp.com',
        databaseURL: 'https://ddfdf-med.firebaseio.com',
        projectId: 'dxdfdfd-dd',
        storageBucket: 'dxxxx-med.appspot.com',
        messagingSenderId: '1041058540005'
    },
    MoipAPI: {
        apiKey: 'Basic VTBRTkJWOUVIMFREQjVGM1sssJTFJddddNBV0dVVEdMMFZEMEhPRzZBRE1TS0k0Q1dYQklRT0VWRlJHR0xUQw==',
    },
};

在我关心的@Injectable()服务中

import {environment} from 'environments / environment';

当我从来源标签中的 Google Chrome 访问开发人员工具时，使用ng build --prod命令进行角度构建构建，我可以看到main.435fgfd2cxsss.js内的键。

这是一个问题，因为我的密钥对所有人都可见，它们不应显示在main.435fgfd2cxsss.js中。

如何以安全的方式在Angular中执行此操作？