Скрыть блок конкретному 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 шт):
В текущей конфигурации Вы получаете ссылку текущего положения страницы.
По своей сути 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>