如何保持开发和生产的相同路径

Question

在开发模式下，我在我的应用程序中访问一个页面：http://localhost:8080/myapp/color/edit同一页面在生产中被访问为http://www.myapp.com/color/edi

在我的一个元素中，我使用以下命令POST到服务器：

data-url="/red/edit"

在开发中，上述内容转为http://localhost:8080/red/edit，在生产中转为http://www.myapp.com/red/edit。所以它可以在生产中使用，但不适用于本地。

问题

如何将POST网址放在data-url中，以便POST网址在开发中变为http://localhost:8080/myapp/color/edit，在生产中变为http://www.myapp.com/color/edit

Answer 1

创建baseUrl变量并根据您的环境进行切换。您可以查看window.location值，了解您的应用访问的环境。

<强>生产：

var baseUrl = "";

<强>开发：

var baseUrl = "/myapp";

然后，使用data-url

定义您的baseUrl媒体资源

var dataUrl = baseUrl + "/red/edit";

Answer 2

根据您的应用的构建方式，您可以使用ENV变量，并根据您运行的开发或生产环境更改网址。即data-url=ENVURL + "/color/edit"或某些环境（例如rails）具有链接处理程序来处理切换。

在JS中执行此操作的简单方法是使用window.location.hostname返回当前主机：

var host = window.location.hostname;
var el = TARGET ELEMENT

el.dataset.url = "http://" + host + "/your/post/path";