IP Adresinden Konum Bulma

Ömer | 21 Mart 2023 | API, Web Tasarımı | Yorum yapılmamış

Örnek formu kullanarak nasıl çalıştığını görebilirsiniz.

Günümüzde internetin hayatımızda önemi giderek artmaktadır. Web sitelerinin sayısı arttıkça, kullanıcıların ihtiyaçları da çeşitlenmektedir. İnternet kullanıcıları, IP adresleri üzerinden konum bilgilerini öğrenmek isteyebilirler. Bu konuda, JavaScript ve jQuery gibi web programlama dilleri kullanarak IP adresinden konumunu bulmak mümkündür. Bu blog yazısında, IP adresinden konumunu bulmak için JavaScript ve jQuery kullanımını anlatacağım.

Öncelikle, yukarıdaki HTML kodunda gördüğümüz gibi, bir HTML formu kullanarak IP adresini alacağız. Bu form, jQuery kullanarak sunucuya gönderilecek. jQuery kullanarak, IP adresini sunucuya göndermeden önce formun submit işlemini iptal edeceğiz. Daha sonra, sunucudan gelen yanıtı işleyeceğiz.

İP adresi, bir API kullanılarak sorgulanır. Bu örnekte, ipapi.co adresini kullanacağız. Bu API, IP adresinden konum bilgilerini JSON formatında döndürür. jQuery AJAX metodunu kullanarak API’ye istek gönderip, sonucu alacağız. Bu istek gönderme işlemi, formun submit event’i tetiklendiğinde gerçekleştirilecektir.

API’den gelen sonuç, JavaScript tarafından işlenecek ve sonuçlar HTML sayfasında görüntülenecektir. Bu örnekte, sonuçlar bir div içine yerleştirilecek ve IP adresi, şehir, bölge, ülke, posta kodu, internet sağlayıcısı ve coğrafi konum gibi bilgiler görüntülenecektir.

Şimdi de çalışan kodumuz

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>IP Sorgu</title>
</head>
<body>
<form id="ip-form">
    <label for="ip-input">IP Adresi:</label>
    <input type="text" id="ip-input" name="ip-input">
    <button type="submit">Sorgula</button>
</form>

<div id="result"></div>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $(document).ready(function() {
        $('#ip-form').submit(function(event) {
            event.preventDefault();
            var ip_address = $('#ip-input').val();
            $.ajax({
                url: 'https://ipapi.co/' + ip_address + '/json/',
                dataType: 'json',
                success: function(data) {
                    $('#result').html(`
              <p>IP Adresi: ${data.ip}<br>
              Şehir: ${data.city}<br>
              Bölge: ${data.region}<br>
              Ülke: ${data.country_name}<br>
              İnternet Sağlayıcısı: ${data.org}<br>
              Coğrafi Konum: ${data.latitude}, ${data.longitude}</p>
            `);
                },
                error: function() {
                    $('#result').html('<p>Bilgi alınamadı.</p>');
                }
            });
        });
    });
</script>
</body>
</html>