在我的应用程序代码中使用pulumi输出的最佳方法

问题描述

我想知道在应用程序代码中使用Pulumi部署结果的最佳方法是什么。举一个具体的例子,假设我的Pulumi堆栈为API网关端点生成了以下URL

    [Output]
    public Output<string> APIEndpoint { get; set; }

此URL由存储在S3存储桶中的JavaScript代码使用。 JavaScript在构建期间由webpack捆绑在一起,然后在部署过程中也由Pulumi存储到S3存储桶中。

将这个URL传递到前端JavaScript包代码的最佳方法是什么?

解决方法

经过研究,我决定选择this solution

将部署时间网址注入到如下所示的window对象中

window['runtime-config'] = {
    apiUrl: 'http://localhost:8080/api'
}

它被前端应用程序消耗

    var value = document.getElementById("my_input").value;
    const url = window["runtime-config"].apiUrl;

然后将runtime-config.js文件在部署时覆盖,然后再复制到S3存储桶中

    Func<string,Output<string>?> overwriteFiles = fileName => fileName == "runtime-config.js"? url.Apply(x=>$@"window['runtime-config'] = {{apiUrl: '${x}'}}") : null;  
    var objects = bucket.BucketName.Apply(bucketName => LoadFilesToS3(@"./public",bucketName,overwriteFiles));