sleep 펑션을 만들어 펑션이 호출된 시점으로부터 내가 설정한시간(3초) 동안 while문을 실행시켜
지연시키는 방법으로 작업하였다.
function work() {
var ms = 3000; // 초단위 설정
while(true) {
sleep(ms);
console.log("ms 만큼의 시간이 지난뒤에 출력된다.)
}
}
function sleep(ms) {
var start = new Date().getTime(); // 함수가 호출된 시간으로 부터
while (new Date().getTime() < start + ms); // 내가 설정한 시간까지 loop를 돌리는 방식이다.
}
// 로그인에 성공하면 내 정보가 찍힌다.
// 이정보를 가지고 시큐리티등등 보안을 더한 로그인을 구현하면 된다!
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}
// 로그아웃에 사용할 버튼
function signOut() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
self.location="/logout";
});
}
※ 완성된코드~~!!
나의 포스팅 순서대로 따라왔다면 쉽게 구현가능할것이다! ㅎㅎ ~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://apis.google.com/js/platform.js" async defer></script>
<meta name="google-signin-client_id" content="{발급받은 클라이언트 ID}.apps.googleusercontent.com"></meta>
<title>로그인 페이지</title>
</head>
<body>
<h1>로그인</h1>
<hr>
<!-- 구글 로그인 추가 -->
<div class="g-signin2" data-onsuccess="onSignIn"></div>
<a href="#" onclick="signOut();">Sign out</a>
<script src="/resources/css/bower_components/jquery/dist/jquery.min.js"></script>
<script src="/resources/css/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="/resources/js/utils/easy_ui/jquery.easyui.min.js"></script>
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script>
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}
function signOut() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
self.location="로그아웃할 url";
});
}
</script>
</body>
</html>
1. 자바스크립트는 클라이언트 컴퓨터에서 임의로 디렉터리와 파일을 만들거나 지울 수 없다. 이런 기능 제약으로 인해서 자바스크립트 프로그램은 클라이언트 컴퓨터의 데이터를 삭제하거나 바이러스를 침투시킬 수 없다. 그러나 HTML5에서는 사용자가 직접 선택한 파일을 불러오는 방법과 일고 쓰기가 가능한 보안 전용 파일 시스템을 확득하는 방법이 있다.
2. 자바스크립트는 브라우저에서 새 창을 열 수 있다. 하지만 광고주들의 팝업 남용을 막기 위해 대부분의 브라우저는 새 창 열기를 막아 두고 마우스 클릭 같은 행동으로 사용자가 직접 새 창을 열게 한다.
3. 자바스크립트는 스스로 연 새 창은 다시 닫을 수 있지만, 다른 창을 닫으려면 사용자가 확인 창에서 승인을 해주어야 한다.
4. HTML FileUpload 요소(<input type="file">)의 value 속성은 값을 불러올 수는 있지만 지정할 수는 없다. 이것이 가능하면 자바스크립트로 원하는 파일을 value 속성에 지정할 수 있으므로, 서버로 특정 파일의 내용(예를 들면 계정 암호)을 업로드하는 폼을 만들 수 있기 때문이다.
5. 스크립트는 자신이 실행된 문서의 서버와 다른 서버에서 불러온 문서의 내용은 읽을 수 없다. 비슷한 의미로 스크립트는 다른 서버에서 불러온 문서에 이벤트 리스너를 등록할 수 없다. 이 제약 사항이 다른 페이지에서 (암호를 입력할 때 생기는 키보드 입력 같은) 사용자 입력을 가로체는 스크립트를 심지 못하게 한다. 이 제약 사항을 동일 출처 정책(same-origin policy)이라고 한다.