Posted in HTML,PHP,JavaScript

ip보기 소스

 Published Date: 2023년 11월 02일 
<meta charset="UTF-8">
<style>
  #client-ip {
    color: #ff80ab;
  }
</style>

<div><span id="client-ip"></span></div>

<script>
  // HTML의 <script> 요소를 생성한다
  const se = document.createElement('script');
  // <script> 요소의 src 속성을 설정한다
  se.src = 'https://ipinfo.io?callback=callback';
  // <body> 요소의 하위 끝에 붙인다
  // 그리고 콜백 함수를 호출한다
  document.body.appendChild(se);
  // 앞서 생성한 <script> 요소를 제거한다
  document.body.removeChild(se);

  // 콜백 함수가 호출된다
  function callback(data) {
    document.getElementById('client-ip').textContent = data.ip;
  }
</script>

<style>
  #window-info [id^="w-i-"] {
    color: #ff80ab;
  }
</style>

<div id="window-info">
  <div>현재 페이지의 URL: <span id="w-i-href"></span></div>
  <div>바로 전 페이지의 URI: <span id="w-i-referrer"></span></div>
  <div>사용자의 에이전트: <span id="w-i-userAgent"></span></div>
  <div>사용자의 언어: <span id="w-i-language"></span></div>
  <div>웹 브라우저 창의 폭(너비): <span id="w-i-width"></span></div>
  <div>웹 브라우저 창의 높이: <span id="w-i-height"></span></div>
</div>

<script>
  document.getElementById('w-i-href').textContent = window.location.href;
  document.getElementById('w-i-referrer').textContent = window.document.referrer;
  document.getElementById('w-i-userAgent').textContent = window.navigator.userAgent;
  document.getElementById('w-i-language').textContent = window.navigator.language;
  document.getElementById('w-i-width').textContent = window.screen.width;
  document.getElementById('w-i-height').textContent = window.screen.height;
</script>

현재 페이지의 URL:

바로 전 페이지의 URI:

접속 브라우저:

사용자의 언어:

웹 브라우저 창의 폭(너비):

웹 브라우저 창의 높이: