I have this basic code to retrieve latitude and longitude with Geolocation API :
showmap.html
<button onclick="getLocation()">Find me </button>
<script type="text/javascript" src="js/geolocation.js"></script>
js/geolocation.js
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
alert("Geolocation is not supported by your browser. Please update your browser. Visit Help Center.");
}
}
function showPosition(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
console.log("Latitude : " + latitude + "<br> Longitude :" + longitude);
}
When I click on the button I receive this error in the console
SyntaxError: An invalid or illegal string was specified showmap.html:72
_sendMessage file:///home/user/Desktop/Projects/showmap.html:72
call file:///home/user/Desktop/Projects/showmap.html:64
getCurrentPosition file:///home/user/Desktop/Projects/showmap.html:16
getLocation file:///home/user/Desktop/Projects/js/geolocation.js:4
onclick file:///home/user/Desktop/Projects/showmap.html:1
fireMouseEvent resource://devtools/server/actors/emulation/touch-simulator.js:290
dispatchMouseEvents resource://devtools/server/actors/emulation/touch-simulator.js:264
I'm trying to figure out how to solve this issue. Is this not working because I'm in file://
?
To get file:
to work with Geolocation Api, run ngrok
and use the https
url to host your HTML app. No need for PHP or backend language like Python, you can generate a local tunnel using your credentials.
This assumes you have ngrok installed and that you are running Ubuntu.
Open terminal and run :
ngrok http -auth="user:password" file:///path/to/your/HTML/project
Reference : Serving local directories with ngrok's built-in fileserver https://ngrok.com/docs
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.