When my mentor assigned us other html-related topics to learn for the week, including this one, I asked exactly this question. I had never heard of it; therefore, it was an exciting subject to me. I definitely won’t claim to be an HTML expert, but I most definitely didn’t anticipate learning that we could obtain our location by including some JavaScript in our HTML document. I’ll just say that I put some serious effort into learning and comprehending it to the best of my ability, and that’s what I’ll share in this post.

As one of the greatest APIs for determining the user’s geographic location for a web application, Geolocation was introduced with HTML5 and is one of the best. You can now navigate to the latitude and longitude coordinates of the person currently visiting a website thanks to this new feature added to HTML5. Additionally, as the user is moving, their location can also be identified, which we can then display on Google Map!

These coordinates can be recorded by JavaScript and transmitted to the server, which can subsequently display the user’s position on the page.

The user’s location can be determined using IP addresses, Wi-Fi, mac addresses, inbuilt GPS devices, and other network routing addresses.

Will users’ privacy be violated without their knowledge; you could be asking. That’s a good point, which is why the geolocation API was designed in a such manner that the user’s location won’t be shown until they give the required consent.

It’s crucial to remember that you need to have a basic understanding of JavaScript before you can grasp its coding notion.

The fact that not all browsers implement this geolocation API and the navigator’s geolocation feature is another eye-catching fact about it. Which browsers support a geolocation, can be ascertained using navigation.geolocation object.

It’s vital to remember that the script element is used to embed the script, which is written in JavaScript, within the HTML document. In the paragraphs that follow, I’ll go in-depth on JavaScript codes.

Remember that the geolocation API works in tandem with the geolocation methods and uses the navigation.geolocation object to return the user’s identified location. You can get a code snippet of it, here.

The geolocation methods are getCurrentPosition(), watchPosition(), and clearWatch(), which determine the device or user’s current location and return a position with data, return a value if the device location changes, and stop the previous watchPosition() call. You can also view the code snippet of these methods, here.

And with that, I will conclude this article about my understanding of the HTML Geolocation API. It should serve as a decent introduction to the subject, I hope😊.

References: HTML Geolocation — javatpoint and HTML Geolocation API (w3schools.com)