Creating a connection between IP addresses and their location
Mct5330
Posted on January 31, 2022
IP-Fast
if (this.ip === null) {
this.updateUserIP();
}
Above is our part of the program that lets us know if there is no current ip information, if not then we will call for it to be updated.
Below are the two parts of the code we use to assign the fetched ip values to this.ip, and this.location. The first thing we do is connect to the api using fetch(this.ipLookUp)
to get the information we need. Next we assign it. In this case this.ip is getting assigned the IP address that ip-fetch collected, and this.location is being assigned the city and country that ip-fetch collected. (Think link was also useful in checking the data: https://ip-fast.com/api/ip/?format=json&location=True)
async updateUserIP() {
return fetch(this.ipLookUp)
.then(resp => {
if (resp.ok) {
return resp.json();
}
return false;
})
.then(data => {
this.ip = data.ip;
this.location = `${data.city}, ${data.country}`;
return data;
});
GEOIpData
async getGEOIPData() {
const IPClass = new UserIP();
const userIPData = await IPClass.updateUserIP();
return fetch(this.locationEndpoint + userIPData.ip)
.then(resp => {
if (resp.ok) {
return resp.json();
}
return false;
})
.then(data => {
console.log(data);
this.long = data.longitude;
this.lat = data.latitude;
this.city = data.city;
this.state = data.region_name;
return data;
});
}
Above is a similar block to assign longitude, latitude, city, and state information. What's different though is this api uses the fetch-ip method along with the geoip api above in this line const userIPData = await IPClass.updateUserIP();
.
However I keep getting the error below and the map won't update.
Failed to load resource: Origin
http://localhost:8000 is not
allowed by Access-Control-Allow-
Origin.
Posted on January 31, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.