如何使用Angular 2或TypeScript获取访问者位置

Ame*_*ani 8 typescript angular

我开始使用ServerVariables["HTTP_CF_IPCOUNTRY"]后端服务器的get by ,但它太慢了,我需要一个Angular或TypeScript解决方案.

Viv*_*shi 23

如果你想从前端获取位置,我们可以通过javascript获取位置

var x = document.getElementById("demo");
function getLocation() {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(showPosition);
        } else {
            x.innerHTML = "Geolocation is not supported by this browser.";
        }
    }
    function showPosition(position) {
        x.innerHTML = "Latitude: " + position.coords.latitude + 
        "<br>Longitude: " + position.coords.longitude; 
    }
Run Code Online (Sandbox Code Playgroud)

这将要求用户从浏览器共享位置,并完成它.

更多细节.

在Angular 2 Component中实现OnInit,将该代码放在ngOnInit中

import { Component, OnInit } from '@angular/core';
export class LocationComponent implements OnInit {
    ngOnInit(){
        if(window.navigator.geolocation){
            window.navigator.geolocation.getCurrentPosition(this.setPosition.bind(this));
            };
        }
    }
}
Run Code Online (Sandbox Code Playgroud)


Ame*_*ani 11

使用Vivek示例找到解决方案.

ngOnInit() {

    if (window.navigator && window.navigator.geolocation) {
        window.navigator.geolocation.getCurrentPosition(
            position => {
                this.geolocationPosition = position,
                    console.log(position)
            },
            error => {
                switch (error.code) {
                    case 1:
                        console.log('Permission Denied');
                        break;
                    case 2:
                        console.log('Position Unavailable');
                        break;
                    case 3:
                        console.log('Timeout');
                        break;
                }
            }
        );
    };
}
Run Code Online (Sandbox Code Playgroud)