我在覆盆子PI中有一个网络应用和API。 Web应用程序使用HTTP GET请求到API以显示其内容
现在,在网络应用内部组件.ts:
export class AppComponent implements OnInit {
results = {};
constructor(private http: HttpClient) {}
ngOnInit(): void {
var url = 'http://localhost:8000/api/';
var endpoint = 'test/';
this.http.get(url + endpoint).subscribe(data => {
this.results = data['test'];
})
}
}
当我在覆盆子内的浏览器上打开Web应用程序时,此功能正常。 但是,当使用raspberry的IP和应用程序正在运行的端口从其他设备打开Web应用程序时,我无法从API获取数据。
我认为这是因为'localhost',并且一旦这个锉刀不能用STATIC IP设置我想要检索它的本地IP,做类似的东西:
ngOnInit(): void {
var ip = <some code <-- HELP>
var url = 'http://' + ip + ':8000/api/';
var endpoint = 'test/';
this.http.get(url + endpoint).subscribe(data => {
this.results = data['test'];
})
}
我已经测试过,如果我手动将IP放在代码中,虽然它只是用于测试,但我不想手动输入。
答案 0 :(得分:10)
您可以origin
获取window.location.origin
。有关详细信息,请查看here
ngOnInit(): void {
var ip = window.location.origin // this will give you the ip:port
//if you just want the ip or hostname you can use window.location.hostname
var url = ip + '/api/';
var endpoint = 'test/';
this.http.get(url + endpoint).subscribe(data => {
this.results = data['test'];
})
}