간단한 jQuery 암호 화면?

Question

90 년대 후반의 악의가없는 우리 회사의 더 크고 나은 웹 사이트로 업그레이드하는 사이에 뭔가 구현하도록 요청 받았습니다.

Google 사이트에 프로모션을 표시해야합니다. 우리는 도매상입니다. 우리는 누구도 그들을 볼 수 없기를 바랍니다. 경쟁은 항상 몰래 들어가서 가격을 책정하는 방법을 찾게됩니다. 이는 알려진 사실이며 일반적인 관행입니다.하지만 임의의 사람이 링크를 클릭하여 볼 수있는 것을 원하지는 않습니다. 보안은이 임시 인스턴스에 대한 커다란 문제는 아닙니다.

이것은 사용자 제어/로그인/데이터베이스가없는 간단한 사이트입니다. 간단한 HTML. 내가 여기 오기 훨씬 오래 지어졌습니다. 나는 "프로모션"탐색 버튼을 클릭하여 사용자가 원하는

:

그래서, 여기에 내가하는 방법을 알고 싶은거야. promot.htm 링크로 이동하게됩니다.

하지만이 페이지를로드 할 때 가장 먼저 보는 것은 전체 화면과 그 뒤에있는 모든 것을 다루는 div입니다. 거기에 간단한 "암호"입력 필드가 있기를 바랍니다. 올바른 비밀번호를 입력하고 아래 버튼을 클릭하면이로드 블록 비밀번호가 사라지고 콘텐츠에 시각적으로 액세스 할 수 있습니다.

저는이 문제로 인해 인터넷 검색을 시도했지만 비밀번호 길이/강도를 검증하는 방법에 대한 링크 또는 적절한 데이터베이스와 로그인과 관련하여 비밀번호에 대한 링크 만 만났습니다.

난 많은 코드가 필요하지 않습니다. 나는 푸시 또는 몇 가지 출발 아이디어가 주어지면 스스로 충분히 이해할 수 있다고 생각하고 싶습니다.

가능한 문제는 사람들이 Chrome의 검사기와 같은 것을 사용하고 차단 div/요소를 숨길 수있는 능력입니다. 다시 말하지만 암호가 빠져 나오고 경쟁에서 결국 경쟁의 일부를 볼 수는 있지만 브라우저에서 div를 숨겨서 볼 수있는 방법을 알고있는 사람은 누구도 원하지 않습니다.

누구나 (간단한?) 텍스트 필드 검사기를 만들 수있는 아이디어가 있습니까?

Answer 1

여기 .fromCharCode()

으로 난독 일부 유쾌하게 안전하지 않은 암호를 사용하여, 거기에 내 걸릴입니다 (힌트 : 암호는 "hunter2"를) HTML에서

var arr = [104, 117, 110, 116, 101, 114, 50]; 
 
var str = ''; 
 
arr.forEach(function (val, index) { 
 
    str += String.fromCharCode(val); 
 
}) 
 

 
$('#form').on('submit', function (event) { 
 
    event.preventDefault(); 
 
    
 
    var pw = $(this).find('#password'); 
 
    
 
    if (pw.val() == str) { 
 
    $('#fortknox').hide(); 
 
    } 
 
    
 
})

#fortknox { 
 
    position: fixed; 
 
    top:0;left:0; 
 
    width:100%; 
 
    height:100%; 
 
    background-color:black; 
 
    z-index: 100; 
 
} 
 

 
#fortknox form { 
 
    display:block; 
 
    margin: 50px auto; 
 
    text-align: center; 
 
} 
 

 
#content { 
 
    position:relative; 
 
    width:100vw; 
 
    height:100vh; 
 
    background-image:url('http://i.imgur.com/8Jne9VO.png'); 
 
    background-repeat:no-repeat; 
 
    background-size: 100% 100%; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div id="fortknox"> 
 
    <form id="form"> 
 
    <input type="password" id="password" placeholder="password"> 
 
    <button type="submit">Enter</button> 
 
    </form> 
 
</div> 
 
    
 
<div id="content"></div>