모든 페이지를 확인하여 사용자가 18 세 이상으로 인증되었는지 확인하십시오.

나는 모든 방문자가 사이트를보기 전에 18 세 이상임을 확인해야하는 웹 사이트 (담배 관련)에서 일하고 있습니다. 나이를 확인하는 양식이 있지만 막 다른 길에 있습니다. 테스트를 통과 한 쿠키를 저장하고 모든 페이지를 검사하여이 검사가 이미 통과되었는지 확인하는 방법은 무엇입니까? 모든 제안과 도움은 대단히 감사하겠습니다! 아래는 나의 유효성 확인 양식입니다.모든 페이지를 확인하여 사용자가 18 세 이상으로 인증되었는지 확인하십시오.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Validate</title> 
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.js"></script> 
<script language="javascript"> 
     function checkAge() 
     { 
      var min_age = 18; 

      var year = parseInt(document.forms["age_form"]["year"].value); 
      var month = parseInt(document.forms["age_form"]["month"].value) - 1; 
      var day = parseInt(document.forms["age_form"]["day"].value); 

      var theirDate = new Date((year + min_age), month, day); 
      var today = new Date; 

      if ((today.getTime() - theirDate.getTime()) < 0) { 
       alert("You are too young to enter this site!"); 
       return false; 
      } 
      else { 
       return true; 
      } 
     } 
    </script> 

</head> 
<body> 

<form action="index.html" name="age_form" method="get" id="age_form"> 
<select name="day" id="day"> 
    <option value="0" selected>DAY</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="8">8</option> 
    <option value="9">9</option> 
    <option value="10">10</option> 
    <option value="11">11</option> 
    <option value="12">12</option> 
    <option value="13">13</option> 
    <option value="14">14</option> 
    <option value="15">15</option> 
    <option value="16">16</option> 
    <option value="17">17</option> 
    <option value="18">18</option> 
    <option value="19">19</option> 
    <option value="20">20</option> 
    <option value="21">21</option> 
    <option value="22">22</option> 
    <option value="23">23</option> 
    <option value="24">24</option> 
    <option value="25">25</option> 
    <option value="26">26</option> 
    <option value="27">27</option> 
    <option value="28">28</option> 
    <option value="29">29</option> 
    <option value="30">30</option> 
    <option value="31">31</option> 
</select> 
<select name="month" id="month"> 
    <option value="0" selected>MONTH</option> 
    <option value="1">January</option> 
    <option value="2">February</option> 
    <option value="3">March</option> 
    <option value="4">April</option> 
    <option value="5">May</option> 
    <option value="6">June</option> 
    <option value="7">July</option> 
    <option value="8">August</option> 
    <option value="9">September</option> 
    <option value="10">October</option> 
    <option value="11">November</option> 
    <option value="12">December</option> 
</select> 
<select name="year" id="year"> 
    <option value="0" selected>YEAR</option> 
    <option value="1920">1920</option> 
    <option value="1921">1921</option> 
    <option value="1922">1922</option> 
    <option value="1923">1923</option> 
    <option value="1924">1924</option> 
    <option value="1925">1925</option> 
    <option value="1926">1926</option> 
    <option value="1927">1927</option> 
    <option value="1928">1928</option> 
    <option value="1929">1929</option> 
    <option value="1930">1930</option> 
    <option value="1931">1931</option> 
    <option value="1932">1932</option> 
    <option value="1933">1933</option> 
    <option value="1934">1934</option> 
    <option value="1935">1935</option> 
    <option value="1936">1936</option> 
    <option value="1937">1937</option> 
    <option value="1938">1938</option> 
    <option value="1939">1939</option> 
    <option value="1940">1940</option> 
    <option value="1941">1941</option> 
    <option value="1942">1942</option> 
    <option value="1943">1943</option> 
    <option value="1944">1944</option> 
    <option value="1945">1945</option> 
    <option value="1946">1946</option> 
    <option value="1947">1947</option> 
    <option value="1948">1948</option> 
    <option value="1949">1949</option> 
    <option value="1950">1950</option> 
    <option value="1951">1951</option> 
    <option value="1952">1952</option> 
    <option value="1953">1953</option> 
    <option value="1954">1954</option> 
    <option value="1955">1955</option> 
    <option value="1956">1956</option> 
    <option value="1957">1957</option> 
    <option value="1958">1958</option> 
    <option value="1959">1959</option> 
    <option value="1960">1960</option> 
    <option value="1961">1961</option> 
    <option value="1962">1962</option> 
    <option value="1963">1963</option> 
    <option value="1964">1964</option> 
    <option value="1965">1965</option> 
    <option value="1966">1966</option> 
    <option value="1967">1967</option> 
    <option value="1968">1968</option> 
    <option value="1969">1969</option> 
    <option value="1970">1970</option> 
    <option value="1971">1971</option> 
    <option value="1972">1972</option> 
    <option value="1973">1973</option> 
    <option value="1974">1974</option> 
    <option value="1975">1975</option> 
    <option value="1976">1976</option> 
    <option value="1977">1977</option> 
    <option value="1978">1978</option> 
    <option value="1979">1979</option> 
    <option value="1980">1980</option> 
    <option value="1981">1981</option> 
    <option value="1982">1982</option> 
    <option value="1983">1983</option> 
    <option value="1984">1984</option> 
    <option value="1985">1985</option> 
    <option value="1986">1986</option> 
    <option value="1987">1987</option> 
    <option value="1988">1988</option> 
    <option value="1989">1989</option> 
    <option value="1990">1990</option> 
    <option value="1991">1991</option> 
    <option value="1992">1992</option> 
    <option value="1993">1993</option> 
    <option value="1994">1994</option> 
    <option value="1995">1995</option> 
    <option value="1996">1996</option> 
    <option value="1997">1997</option> 
    <option value="1998">1998</option> 
    <option value="1999">1999</option> 
</select> 
</form> 
</body> 
</html>

출처

2010-05-28 liquilife

클라이언트 측에서이 모든 작업을 수행하려는 경우에는 가능합니다. 이것은 쉽게 피할 수 있으므로 클라이언트의 자바 스크립트에 실제 보안을 구현하고 싶지는 않지만 watchdog 그룹을 등 뒤에서 유지하는 것은 어리석은 일입니다.

위의 HTML 파일을 checkAge.html로 저장했다고 가정합니다. 하여 <form> 태그에 다음을 추가 : 양식이 제출 될 때

<form action="index.html" name="age_form" method="get" id="age_form" onSubmit="checkAge()">

이는 checkAge 기능을 실행합니다. 사람이 18 세 이상이라고 말하면 함수는 true를 반환하고 양식이 제출되고 index.html이로드됩니다. 그들이 18이 아니라고 말하면 함수는 false를 반환하고 경고 팝업이 표시되며 양식이 제출되지 않습니다.

그리고 마지막 부분은 다음과 같습니다 귀하의 checkAge 기능을 수정

 var ret; 
     if ((today.getTime() - theirDate.getTime()) < 0) { 
      alert("You are too young to enter this site!"); 
      ret = false; 
     } 
     else { 
      ret = true; 
     } 
     setCookie('ageCheck', ret, 1); // save the cookie for one day 
     return ret; 
    }

이 쿠키를 설정 한 다음 true 또는 false를 반환하는 코드를 추가합니다.

또한, 설정 쿠키를 쉽게하기 위해 this function을 추가해야합니다

function setCookie(c_name,value,expiredays) { 
    var exdate=new Date(); 
    exdate.setDate(exdate.getDate()+expiredays); 
    document.cookie=c_name+ "=" +escape(value)+ 
    ((expiredays==null) ? "" : ";expires="+exdate.toUTCString()); 
}

이 좀 더 쉽게 쿠키를 설정하게 그냥 도우미 기능입니다.

그런 다음, 콘텐츠 페이지에, 당신은 같은 것을 할 수 있습니다

<html> 
<head> 
    <title>My age-restricted content</title> 
    <script> 
    window.onload = function() { 
     var ageCheck = getCookie('ageCheck'); 
     if ('true' == ageCheck) { 
     document.getElementById('content').style.display = ''; 
     } else { 
     window.location = '/checkAge.html'; 
     } 
    } 
    function getCookie(c_name) 
    { 
    if (document.cookie.length>0) 
     { 
     c_start=document.cookie.indexOf(c_name + "="); 
     if (c_start!=-1) 
     { 
     c_start=c_start + c_name.length+1; 
     c_end=document.cookie.indexOf(";",c_start); 
     if (c_end==-1) c_end=document.cookie.length; 
     return unescape(document.cookie.substring(c_start,c_end)); 
     } 
     } 
    return ""; 
    } 

    </script> 
    </head> 
<body> 
    <div id="content" style="display: none;"> 
    You can't see this unless you are old enough 
    </div> 
</body> 
</html>

이 기본적으로 보이지 않는 페이지의 콘텐츠를합니다. 페이지가로드되면 자바 스크립트 코드는 사람이 18임을 나타내는 쿠키가 있는지 확인합니다.있을 경우 페이지 콘텐츠가 표시됩니다. 쿠키가 없으면 그 사람이 18 세 미만이라고 쿠키가 표시되고 연령 확인 페이지로 리디렉션됩니다.

출처

2010-05-28 17:40:29 pkaeding

이것은 작동하지 않는 것 같습니다. 쿠키 (제한된 콘텐츠 페이지)를 확인하는 위의 예제 페이지를 복사/붙여 넣었습니다. 삭제 및 확인 된 쿠키가 없습니다. 내가 게시 한 HTML이있는 페이지를 방문하면 아무 일도 일어나지 않습니다. 내용은 숨겨져 있고 ageCheck.html에는 리디렉션이 없습니다. 어떤 제안? 지금까지 도와 주셔서 감사합니다. – liquilife

아, 그 코드를 게시하기 전에 코드를 테스트하지 않도록 가르쳐 줄 것입니다! 내가 게시 한 HTML 페이지에 오류가있었습니다 (내용 1, 연령을 확인하지 않음). 나는 대답에서 그것들을 고쳤지 만, 내가 '창'을 가리키는 곳을 살펴 본다. – pkaeding

나는 이것이 아주 가깝다고 느낀다. 리디렉션은 작동하지만 불행히도 쿠키가 존재하는지 여부에 관계없이 리디렉션됩니다. 나는 Firebug를 통해 그것을 실행했고 쿠키는 연령 체크 페이지에서 설정하고있다. 쿠키를 탐지하는 javascript가 영구적으로 agecheck 페이지로 리디렉션됩니다. – liquilife

모든 페이지를 확인하여 사용자가 18 세 이상으로 인증되었는지 확인하십시오.

답변

관련 문제