Question

我认为之前可能会问过。但我根据搜索关键字找不到任何结果。

在我的用例中，我根据阶段信息[desktop，preprod，prod]配置端点。我正在使用golang作为后端。在后端，我使用APP_STAGE环境变量来读取相应的配置。例如，

fileName =  APP_STAGE + "-endpoints.cfg"

我在启动服务器之前导出变量。

$export APP_STAGE="desktop"

desktop-endpoints.cfg将如下所示，

{
    "featured" : {
        "httpendpoint": {
            "url": "http://localhost:8081/api/services/featured/"
        }

    },
    "latest" : {
        "httpendpoint": {
            "url": "http://localhost:8081/api/services/latest/"
        }

    }
}

但是如何在客户端[javascript]实现这一目标？我有以下结构的文件，

app/
    view.js
    featured.js
    home.js

每个文件使用不同的端点进行ajax调用。如何根据javascript中的某个变量[if not env variable]读取阶段配置？

有人可以帮我吗？我对javascript很新。

感谢。

Answer 1

JavaScript文件在客户端由浏览器执行。浏览器无权访问服务器配置文件，因此服务器有责任读取/获取正确的配置值并使其可供客户端使用。有多种方法可以解决这个问题。我将概述一些可能的解决方案。

1。在HTML文件中包含正确的端点

您可以选择在HTML文件中包含正确的端点，这些端点引用将在其中使用的javascript文件。

HTML文件是模板而不是静态文件，您可以使用html/template包来执行这些模板，以包含必要的URL和您需要的所有其他内容，并生成将发送到的最终HTML客户。

HTML模板可能包含初始化某些JavaScript变量的<script>标记，然后可以从包含的JavaScript文件中使用这些变量。

这是一个传递特色httpendpoint的简单示例。

HTML模板（"home.html"）：

<html>
<head>
    <script>
        var featuredHttpEndpoint = "{{.FeaturedHttpEndpoint}}";
    </script>
    <script src="view.js"></script>
    <script src="featured.js"></script>
    <script src="home.js"></script>
</head>
<body>Your body</body>
</html>

将为此HTML模板提供服务的处理程序：

var homeTempl = template.Must(template.New("").ParseFiles("home.html"))

func homeHandler(w http.ResponseWriter, r *http.Request) {
    m := map[string]interface{}{
        // Insert the value of endpoint from your config
        "FeaturedHttpEndpoint": "http://localhost:8081/api/services/featured/",
    }
    if err := homeTempl.Execute(w, m); err != nil {
        // Handle error
    }
}

映射归属处理程序，例如：

http.HandleFunc("/index.html", homeHandler)

并确保主页未被缓存，因此浏览器将始终要求提供新的副本，您的服务器可以在其中插入实际的配置值。

2。从JavaScript文件

执行AJAX请求

您可以选择从JavaScript文件执行AJAX请求以查询必要的信息。在这个问题中可以找到一个简单的例子：Dynamically refresh a part of the template when a variable is updated golang

在实际示例中，您将使用一个请求（例如，以JSON格式）传输客户端所需的所有配置值，此处我只传输一个值。

仅获取/发送精选httpendpoint：

在JavaScript中：

var featuredHttpEndpoint = "";
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        var config = JSON.parse(xhr.responseText);
        featuredHttpEndpoint = config.FeaturedHttpEndpoint;
    }
}
xhr.open("GET", "/config.json", true);
try {
    xhr.send();
} catch (err) {
    // handle error
}

提供配置值的Go处理程序：

func configHandler(w http.ResponseWriter, r *http.Request) {
    w.Header().Set("Content-Type", "application/json")
    m := map[string]interface{}{
        // Insert the value of endpoint from your config
        "FeaturedHttpEndpoint": "http://localhost:8081/api/services/featured/",
    }
    if err := json.NewEncoder(w).Encode(m); err != nil {
        // Handle error
    }
}

必须映射到客户端调用的路径，例如：

http.HandleFunc("/config.json", configHandler)

3。使用Javascript文件作为模板

您也可以选择制作Javascript文件模板，在提供这些模板时，您可以使用模板引擎根据您的环境/ APP_STAGE添加端点。请参阅第1点作为服务模板的示例。

如果您正沿着这条路走下去，您必须正确配置Javascript文件的缓存，因为如果缓存信息显示它们未过期，浏览器将不会再次询问您的js文件。

如何在javascript [客户端]中更改不同阶段的端点？

1 个答案:

1。在HTML文件中包含正确的端点

2。从JavaScript文件

3。使用Javascript文件作为模板