I'm trying to compare the coordinates from an event in my database to those sent by the user from their client API (after approving) but cannot figure how to properly setup the compare. Right now, the user coordinates are just logging in the terminal:
Here's my script under guestValidate.js:
if(confirm('Compare wants to use your current location to briefly checkin. Do you approve?')) {
navigator.geolocation.getCurrentPosition(function (position) {
console.log(position.coords.latitude)
console.log(position.coords.longitude)
})
} else {
console.log("The Locator was denied.");
}
console.log(eventCoords)
Here's the page where I'm running the ejs:
<% layout('layouts/boilerplate') %>
<h1>Prompt</h1>
<script>
const eventCoords = '<%- event.geometry.coordinates %>'
const eventID = '<%- event.id %>';
</script>
<script src="/javascripts/guestValidate.js"></script>
I attached the output from the terminal below. Both are working I just need to structure them as objects and compare, I think? Could somebody help me compare the two sets of coordinates, please?
If they're equal, I want to send a "true" back to the database route.
One way to do this, if the venue is either relatively small, or not strangely shaped, is to just choose the lat/long in the center of the location and allow a radius that you deem reasonable from that point. You will likely want some amount of room for location inaccuracies, since user location services can be unreliable at times. This is especially common when indoors in concrete buildings.
You could just use the Haversine formula, but since the earth isn't actually a sphere, and you are trying to check in at what I assume to be relatively small locations, haversine's potential errors with a sphere make using it a bad idea. (Error could be up to 0.3%, which doesn't sound bad, but the earth is pretty big, so that means up to 20km of error).
Instead I'd recommend a cool library offered by Chris Veness at https://github.com/chrisveness/geodesy
If you are interested, there's a full explanation of the math behind this library for your usage here: https://www.movable-type.co.uk/scripts/latlong-vincenty.html.
In your case, if you wanted to do this comparison in the browser, the usage would look something like this:
<script src="https://cdn.jsdelivr.net/npm/geodesy@2.2.1/latlon-ellipsoidal-vincenty.js"></script>
<script type="module">
import LatLon from 'https://cdn.jsdelivr.net/npm/geodesy@2.2.1/latlon-ellipsoidal-vincenty.js';
function getDistanceBetweenPoints(user, venue) {
const p1 = new LatLon(user.lat, user.lon);
const p2 = new LatLon(venue.lat, venue.lon);
return p1.distanceTo(p2);
}
let user = { lat: 30.2696082, lon: -97.7521805 };
let venue = { lat: 30.2699360, lon: -97.7485410 };
console.log(`Distance between user and venue is ${getDistanceBetweenPoints(user, venue)} meters`);
</script>
This example using your coordinates provided above results in a distance of roughly 352 meters between the user and the venue. Now, depending on whether the user was considered to actually be at the venue when those coordinates were captured, this might be quite accurate, or show you the user device inaccuracies I mentioned before.
One more thing, users can technically spoof their locations, so I wouldn't recommend using this for anything security related.