API和Angular中的主机URL

Question

我在理解Angular应用程序与API的绑定时遇到问题。目前，我正在开发一个小型GUI，它应该在Nginx提供的嵌入式系统上运行。后端是用Python Flask编写的。说的太多了。。。

在这个早期的开发状态中，URL是清晰的，并且通信是有效的。Angular serve命令运行在已知的http://localhost:4200/和上的Flask后端http://127.0.0.1:5000/api/.太棒了我将API URL放在一个常量环境中。它有点像：

...
/* GET a list of serial ports from the backend server. */
getSerialPorts(): Observable<any> {
return this.http.get('http://127.0.0.1:5000/api/' + 'serialports')
.pipe( retry(1), map(data => {
console.log(data)
...
/* Or */
getSerialPorts(): Observable<any> {
return this.http.get(backend_url + 'serialports')
.pipe( retry(1), map(data => {
console.log(data)

现在我的问题是在生产/稳定环境中：我的嵌入式设备在URL中有一个IPV4地址。但是地址可以更改。现在我不知道我是否真的有问题，但我错过了对它的理解——我喜欢先有。

Nginx在http://a.b.c.d/后端位于中的同一主机上http://a.b.c.d/api/

如何继续存储主机名？我是否需要存储用于寻址API的主机名？我可以链接到/api/。。。Angular帮我做剩下的吗？

(很抱歉出现新手问题，但我想了解发生了什么，以及我如何处理。(

Answer 1

我将把API的主机名存储为apiBaseUrl变量。您永远不知道是否需要将后端移动到其他主机。现在它们都在同一个域上，但在某些情况下情况并非如此。