Скрыть блок конкретному IP адресу

не знаю, можно ли вообще такое реализовать. В общем мне нужно скрыть блок определённым IP адресам. К примеру блок <div id="hidden-block-ip"> и я хочу его скрыть для пользователя у которого IP 173.xx.xx.x

Вот что как я это пытался реализовать

<script>
var ip = location.host;
if(ip == 176.xx.xx.x) {
$("product-price").addClass("visible");
}
else
{
$("product-price").removeClass("visible");  
}
</script>


<style>
.visible {
    display: block;
}
</style>

Но не сработало. Потом нашёл на просторах интернета такой вариант

<script type="application/javascript">
function getip(json){
  if(json.query == "173.xx.xx.xx") {
    var elems = document.getElementsByClassName('product-price');
    for (i = 0; i < elems.length; i++) {
    elems[i].style.display = 'none';
     }
  }
}
</script>
<script type="application/javascript" src="http://ip-api.com/json/?callback=getip"></script>

Но тоже безрезультатно. Может есть какой то вариант получше, или какие то идеи. Спасибо заранее)


Ответы (1 шт):

Автор решения: Denis640Kb

В текущей конфигурации Вы получаете ссылку текущего положения страницы.

По своей сути javascript не может получить ip-адрес конечного пользователя, однако javascript способен создавать запросы Http, и уже через них получить нужное значение адреса, поэтому вы можете использовать это как преимущество. Другими словами, если вы хотите получить общедоступный ip-адрес пользователя, вы будете зависеть от запроса на любой сервер.
Вы можете воспользоваться webRTC или использовать сторонние ресурсы.
Подготовил для Вас один пример (Добавил поясняющие комментарии):
В данном случае мы используем API сервиса с сайта ipify.org.

    $.getJSON('https://api.ipify.org?format=json', function(data){ // Получаем через API ip адрес пользователя.
        let div = document.getElementsByClassName('showIP'); // Получаем элемент с классом showIP
        let ip = data.ip; // Получаем ip адрес из data
        div[0].innerText = ip; // Проставляем в первый элемент с классом showIP значение ip адреса
        if(ip == "173.xx.xx.xx") { // Если адрес равен необходимому значению то
            $(".product-price").removeClass("visible"); // скрываем для него данные
        } else {
            $(".product-price").addClass("visible"); // Если адрес другой, то показываем поле.
        }
    });
    .visible {
        display: none;
    }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>Ваш ip адрес:</div>
<div class="showIP">

</div>
<div class="product-price">Видно ;)</div>

→ Ссылка