How to Display User Location on My Website Using JavaScript?

<script> jQuery(document).ready(function($) {
var serviceAreas = [
{ city: "Mumbai", state: "Maharashtra", pin: "400001" },
{ city: "Delhi", state: "Delhi", pin: "110001" },
{ city: "Bengaluru", state: "Karnataka", pin: "560001" },
{ city: "Hyderabad", state: "Telangana", pin: "500001" },
{ city: "Chennai", state: "Tamil Nadu", pin: "600001" },
{ city: "Nainital", state: "Uttarakhand", pin: "263001" },
{ city: "Haldwani", state: "Uttarakhand", pin: "263139" },
{ city: "Kaladhungi", state: "Uttarakhand", pin: "263140" },
{ city: "Gurugram", state: "Haryana", pin: "122001" },
{ city: "Jaipur", state: "Rajasthan", pin: "302001" },
];
`

        function isServiceAvailable(zip) {
            return serviceAreas.some(function(area) {
                return area.pin === zip;
            });
        }

        function getUserLocation() {
            $.get("https://ipapi.co/json/", function(response) {
                var userZip = response.postal;
                var userCity = response.city;
                var userState = response.region;

                if (isServiceAvailable(userZip)) {
                    $('#service-message').html('Great news! We are serving in ' + userCity + ',                       ' + userState + ' (ZIP: ' + userZip + ').');
                } else {
                    $('#service-message').html('Unfortunately, we are not serving in ' + userCity + ', ' + userState + ' (ZIP: ' + userZip + ') at this time.');
                }
            }, "json");
        }

        // Display the service area message on page load
        getUserLocation();
    });
</script>`

this is the sample to code it will map the zip code on the basis of stored addresses.
without askeing browser user location access
can anyone solve this understand the code try to figure out the bugs and solve it .

because it does not accurately mapping the zip code to provide the exact information.

i tried as shown in my code but unable to manage the api fallbacks .

key points->>
displaying user permission without asking it may be by using ip address
stores city zip codes when user open the website these location it should reflect the stored city name other wise a message coming soon
but unfortunality its not working as expected i also used google api key which i will not be sharing but still its not working

anyone to figure out the bugs in my code i will be really thankful .
you can reply to code i will replace my google map api key.

Body: I’m working on a web project and would like to display the user’s location (city, country) on the page based on their IP address or geolocation. I’m using JavaScript and possibly an API, but I’m not sure of the best approach.

Can someone guide me on how to implement this feature? I would appreciate a step-by-step explanation or example code.

looking forward to get the solution form the genius`

You need to sign in to view this answers