laravel - Vue.js - 地理定位不适用于移动设备......为什么？

Question

我尝试使用 Vue 组件访问地理定位 - 在 Desktopbrowers 上它可以工作，但是在移动浏览器上它不起作用......

测试地址 http://www.padermeet.de/geolocation

这是什么原因？

<template>
    <div>
        <p>Click the button to get your coordinates.</p>
        <button @click="getLocation">Try It</button>
        <p id="demo" v-text="text"></p>
    </div>
</template>

<script>
    export default {
        data(){
            return {
                text: 'Hier wird deine Latitude und Longitude angezeigt.',
                lat: '',
                lng: ''
            }
        },
        methods: {
            getLocation() {
                if (window.navigator.geolocation) {
                    window.navigator.geolocation.getCurrentPosition(this.showPosition);
                } else { 
                    text = "Geolocation is not supported by this browser.";
                }
            },
            showPosition(position) {
                this.lat = position.coords.latitude,
                this.lng = position.coords.longitude,
                this.text = "deine Location befindet sich in: Latitude:" + this.lat + " und Longitude: " + this.lng;
            } 

        }
    }
</script>

<style lang="scss">
</style>

Answer 1

chrome 上的地理位置不适用于非安全来源。

Deprecation] getCurrentPosition() and watchPosition() no longer work on insecure origins. To use this feature, you should consider switching your application to a secure origin, such as HTTPS.

您需要一个 https 才能正确处理它。

引用

https://sites.google.com/a/chromium.org/dev/Home/chromium-security/deprecating-powerful-features-on-insecure-origins

希望对你有帮助