세이박스

'웹프로그램'에 해당되는 글 286건

  1. 자바스크립트 <a href 클릭시 팝업 띄우기 및 클릭한 URL 값 받아오기
  2. 자바스크립트로 클릭 이벤트 강제 발생 시키기
  3. 자바스크립트 select 셀렉트 박스 선택한 값을 받아오기
  4. 자바스크립트 아이프레임 내용 길이에 맞게 리사즈 하기
  5. 자바스크립트 iframe에서 내용에 따라 자동으로 크기 변환하기
  6. 자바스크립트 select 값 받기
  7. 자바스크립트에서 이미지 파일이 없는 경우 오류 안보이게 하기
  8. 자바스크립트 팝업을 가운데 띄우고 포커스를 팝업으로 하기
  9. 자바스크립트 문자열 우측에서 잘라서 가져오기
  10. 자바스크립트 팝업 화면 가운데 띄우기
  11. 자바스크립트 접속자의 동작 이벤트를 감지 하여 다른 이벤트 처리하기
  12. 자바스크립트 주민번호,외국인번호,사업자번호 체크 Script
  13. 자바스크립트 새로고침또는 창닫기시 이벤트 처리하기
  14. 자바스크립트 div 숨기기 보여주기
  15. 자바스크립트 레이어 팝업소스 오늘하루 이창열지 않기
  16. 자바스크립트 하루동안 안 열리는 팝업
  17. 자바스크립트 location 으로 새창 띄우기
  18. 자바스크립트 Internet Explorer 7 에서 self.close 사용하기
  19. 자바스크립트 메뉴를 클릭시 div를 보였다 안보였다 하기
  20. 자바스크립트 div를 이용하여 보였다 안보였다 하기 visibility 이용
  21. 자바스크립트 입력 내용이 숫자만 입력했는지 체크
  22. 자바스크립트 클립보드에 내용 복사하기
  23. 자바스크립트 배우기 - Event 잡아내기
  24. 자바스크립트 특정 부분 클릭시 스크립트 함수 호출하기
  25. 자바스크립트 팝업창에서 부모 페이지 reload 하기
  26. 자바스크립트 쿠키를 서브 도메인 공유하기
  27. 자바스크립트 여러도메인 하나의 쿠키로 적용하기 [setcookie 함수]
  28. 자바스크립트 키(Cookie) 취약점
  29. 자바스크립트 네이버에서 이미지 클릭 하면 본창에서 확대되는 기능입니다.
  30. 자바스크립트 이미지 리사이징 함수

자바스크립트 <a href 클릭시 팝업 띄우기 및 클릭한 URL 값 받아오기

웹프로그램

사용자가 <a href="">링크</a> 로 된 링크를 클릭시 이동하고자 하는 URL을 알아내거나 클릭한 페이지로 이동하기전 자신이 원하는 행동을 하고자 할때 다음과 같이 사용자 이벤트 메시지를 잡아 낼 수 있다.

다음 소스는 사용자가 링크를 클릭시 자신이 원하는 곳으로 새창을 띄운뒤 다시 부모창으로 포커스를 이동한다음 원래 클릭해서 이동하고자 한 곳을 보여주는 내용 입니다.
목적은 홈페이지 모든 소스에 클릭시 원하는 곳으로 띄운뒤 새로운 창을 띄워야 하는 기능을 추가할려고 하다 보니 아래와 같이 구현하게 되었음.
이렇게 해서 굳이 사이트 코딩을 일일이 변경 해주지 않아도 원하는 영역에 이벤트 기능을 넣을수 있음.

<html>
<script language="JavaScript">
function linkclick() {
 var e = arguments[0] || event;
 var target = e.target || e.srcElement;
 if(target.tagName.toLowerCase() == "a") { //클릭한 곳이 <a 태그인지 확인
  window.open("새창 URL","_blank"); //팝업을 새창으로 띄우기 이외에도 원하는 이벤트처리
  window.focus(); //새창이 뜬뒤 포커스를 다시 본창으로 오도록 처리
 }
}
</script>
<body onClick="linkclick()">
<a href="a.html">a</a>
<a href="b.html">b</a>
<a href="c.html">c</a>
</body>
</html>

참고: 간혹 포커스가 다시 부모창으로 안돌아올 경우 새창 페이지에도 다음과 같이 추가해주면 확실하게 포커스가 돌아온다.
<html>
<body onLoad="opener.focus()">
</body>
</html>

위 기능을 응용하면 마우스를 스크롤 움직인다던지 특정 <input 박스를 클릭한다던지 어떠한 사용자 액션이라도 감지 하여 원하는 이벤트를 실행할 수 있습니다.
위 와 같은 기능으로 로그를 잡고자 할때에도 유용하게 쓰이겠죠.
페이지중에서 사용자가 어디를 클릭하는지 감지 하고자 할때

 if(target.tagName.toLowerCase() == "a") { //클릭한 곳이 <a 태그인지 확인
  alert(target);
 }

위 소스의 target은 사용자가 클릭한 URL을 담고 있으므로 target정보를 저장할 수 있으니 접속자 패턴을 분석하는데 용이할듯.
아마도 통계 분석해주는 사이트에서 보통 스크립트 한줄 삽입하는데 이와 같은 원리로 로그를 잡는것 같다. ^^

위 글은 세이박스에서 직접 작성한 것으로 퍼가실 경우 반드시 출처와 함께 남기시길 바랍니다.
출처 : 세이박스 http://saybox.tistory.com/468

자바스크립트로 클릭 이벤트 강제 발생 시키기

웹프로그램


Q: 자바스크립트로 다른쪽 frame의 버튼 이벤트 발생시키기


자바스크립트의 초짜입니다.

제가 물어보고 싶은 것은,,

일단 좌,우 2개의 프레임으로 나눠진 웹페이지가 있습니다.
여기에 좌의 프레임에서 자바 스크립트를 실행하여
우의 프레임에 있는 버튼 틀릭 이벤트를 실행 할 수 있는지,,
궁금해서 질문 드립니다.

혹시 가능하다면,,
소스도 좀 부탁드리겠습니다.
 
 
re: 자바스크립트로 다른쪽 frame의 버튼 이벤트 발생시키기


프레임 뼈대
<FRAMESET COLS=100,*>
 <FRAME SRC=a.htm NAME=a>
 <FRAME SRC=b.htm NAME=b>
</FRAMESET>
 
좌측 프레임
<body onload=init()>
a.htm
<script>
 function ck(){
  aa=top.frames.b.document.body.all.tags('INPUT')[0].click();
   }
 function init(){
  tid=setInterval(ck,1000);
 }
</script>


우측프레임
<body>
<input type=button onclick=chk() value=확인><p>
<div id=d></div>
<script>
 function chk(){
  document.getElementById('d').innerHTML=new Date();
 }
</script><p>

자바스크립트 select 셀렉트 박스 선택한 값을 받아오기

웹프로그램
ff.bg.options[bg_frm.bg.selectedIndex].value;
ff -> 폼 이름
bg -> 셀렉트박스 이름
 
 
<script>
function bg_preview() {
 var ff = document.bg_frm;
 var url = ff.bg.options[bg_frm.bg.selectedIndex].value;
 alert(url);
}
</script>
 
<from name="bg_frm">
 <select name="bg" id="bg">
  <option value="1">1</option>
  <option value="2">2</option>
 </select>
</form>

위 글은 세이박스에서 직접 작성한 것으로 퍼가실 경우 반드시 출처와 함께 남기시길 바랍니다.
출처 : 세이박스 http://saybox.tistory.com/

자바스크립트 아이프레임 내용 길이에 맞게 리사즈 하기

웹프로그램

 
아이프레임 자체에서 처리해야함

<script>
function Resize_Frame(name)
{
  if(navigator.appName.indexOf("Microsoft Internet Explorer") != 0)
  {
   var objBody = parent.document.getElementById('KI_board').contentWindow.document.body; 
   var objFrame = parent.document.getElementById('KI_board');
   if (objFrame)
   {
    var H = objBody.scrollHeight + 10;
    H = H+"px";
    objFrame.style.height = H;
    objFrame.style.width = '100%';
   }
  }
  else
  {
   var objBody     = document.body;
   var objFrame = eval("parent.document.getElementById('"+name+"')");
   if (objFrame)
   {
    objFrame.style.height = objBody.scrollHeight + (objBody.offsetHeight - objBody.clientHeight) + 10;
    objFrame.style.width = '100%'
   }
  }
}
</script>

<body onLoad="Resize_Frame('KI_board')">

참조소소 URL : http://www.megapass.net/media/IN_MCbbslistW.php


자바스크립트 iframe에서 내용에 따라 자동으로 크기 변환하기

웹프로그램

<출처 : http://www.taeyo.pe.kr (ASP 게시판)>의 내용을 토대로 재구성하였습니다.

iframe-x을 사용하면서 어떻게 하면 스크롤바가 나타나지 않게 할 수 있을까?

하는 문제를 고민해 보게 된다.



다음 자바스크립트를 사용하면 이런 문제를 해결할 수 있다.



그러나 이 해결책은 동일한 도메인에서 동작할 때만 가능하다.

실제로 LoadBalancing을 할 경우에도 경로를 "/xxx/xxx.asp" 이런 형태로 잡아주니까 제대로 동작했었다. (당연한거 아닌가? -.-)



그럼 먼저 자바스크립트 구문을 살펴보자..



1. 자바스크립트



<script-x>

function Resize_Frame(name)

{

        var Frame_Body  = document.frames(name).document.body;

        var Frame_name  = document.all(name);



        Frame_name.style.width

                = Frame_Body.scrollWidth + (Frame_Body.offsetWidth-Frame_Body.clientWidth);

        Frame_name.style.height

                = Frame_Body.scrollHeight + (Frame_Body.offsetHeight-Frame_Body.clientHeight);



        if (Frame_name.style.height == "0px" || Frame_name.style.width == "0px")

            {

            Frame_name.style.width = "500px";       //기본 iframe-x 너비

            Frame_name.style.height = "300px";      //기본 iframe-x 높이

            window.status = 'iframe-x resizing fail.';

            }

        else

            {

            window.status = '';

            }

}

</script-x>



프레임에 들어갈 것의 Width와 Height를 가져와서 그 값으로 iframe-x의 크기를 설정해 주고 있다.



Frame_Body는 iframe-x 안에 들어가는 실제 내용을 가리키고 있으며

Frame_name은 iframe-x 자체를 가리키고 있는 것이다.



어쨌든, 왠만하면 위 소스를 그대로 가져다가 사용하면 된다. ㅋㅋ



2. 활용



활용하기 위해서 iframe-x에 다음과 같이 넣어주면 된다.



<iframe-x name="contents" id="contents" src="/bbs/user/com_list.asp" marginwidth="1" marginheight="1" height="100"

width="500" scrolling="no" border="0" frameborder="0" onLoad="Resize_Frame('contents');"></iframe-x>



세 가지 사항만 주의해서 사용하면 된다.



첫째, name="contents" id="contents" 이 부분이 바뀌면 반드시 Resize_Frame('contents') 요 부분도 변경해 준다.

       대 부분의 경우 그대로 사용하면 된다.



둘째, src="/bbs/user/com_list.asp" 와 같이 반드시 동일한 서버 내에 있는 주소만이 위와 같이 동작한다.

      그렇지 않은 경우, 자바스크립트가 제대로 처리되지 않는다.



셋째, onLoad="Resize_Frame('contents');" 이 부분을 넣어주면 iframe-x이 열릴 때마다 창의 크기를 새롭게 설정하게 된다.

      경우에 따라, 이 부분이 잘 동작하지 않을 수도 있다. 그럴 때는 부모 프레임의 <body>에 다음과 같이

     <body onLoad="Resize_Frame('contents');".. > 넣어주면 된다. (단, 이 경우는 처음 로딩할 때만 크기 계산함)



추가사항 : 만약 서로 도메인이 다르다면, 두 문서 모두에 document.domain을 동일하게 설정해 주면 된다고 한다.



3. iframe-x 내부에 넣기



경우에 따라 iframe-x 내부에서 창의 크기를 조절해야 할 필요가 있다.

iframe-x으로 들어가는 소스에 다음 자바스크립트를 넣으면 된다.



<script-x>

setTimeout("self.resizeTo(document.body.scrollWidth , document.body.scrollHeight)",500);

</script-x>



그러면 Parent Frame에서 특별한 작업 필요없이 해결할 수 있다.



단, 이 경우 현재 IE6.0 이상에서만 테스트 되었다.

자바스크립트 select 값 받기

웹프로그램
<script>
function epoint() { 
var epoint = document.frm.epoint.options[document.frm.epoint.selectedIndex].value;
alert(epoint);
}
<form name="frm" method="post">
<select name="epoint" id="epoint">
         <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>
</select>
</form>
<a href="javascript:epoint()">선택완료</a>

자바스크립트에서 이미지 파일이 없는 경우 오류 안보이게 하기

웹프로그램
이미지가 없거나 인터넷 회선이 좋지않아 이미지를 못 불러온경우 엑박이라는 아주 보기 싫은 상태가 되죠 이때 이러한 이미지인 경우 아예 안보여 주게끔 처리할 수 있습니다.
즉, 이미지 엑박역시 오류로 처리하여 오류 발생시 처리 하지 않도록 하는 기능이 있습니다.

 
onerror를 사용하시면 엑박이 뜨는 경우의 이벤트를 잡을 수 있습니다.
이미지 태그에 다음과 같이 사용하시면 되겠네요.
 
<img ...(중략)...  onerror="this.style.display='none';">

위 글은 세이박스에서 직접 작성한 것으로 퍼가실 경우 반드시 출처와 함께 남기시길 바랍니다.
출처 : 세이박스 http://saybox.tistory.com/

자바스크립트 팝업을 가운데 띄우고 포커스를 팝업으로 하기

웹프로그램
<script>
function new_popup() {  
    var url = http://saybox.tistory.com;
    var n = "";
    var w = "800";
    var h = "300";
    var s = "";
    var winl = (screen.width - w) / 2;
    var wint = (screen.height - h) / 2;
    winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',menubar=no,scrollbars=yes,status=no,toolbar=no,resizable=yes';
    win = window.open(url, n, winprops);
    if (parseInt(navigator.appVersion) >= 4) {
      win.window.focus();
}
</script>

자바스크립트 문자열 우측에서 잘라서 가져오기

웹프로그램
예로써 주문시 적립금을 입력한 금액이 1000원 단위로만 입력했는지 확인하고자 한다면 우측 3자리와 비교해야하므로 이때 substr을 이용하면됨
"5700".length 4이므로 여기에 4 - 3 = 1 위치 부터 문자를 받아옴
즉 결과는 "700"을 받아 오게됨
 
 
<form name="form" method="post">
  <input type="text" name="reservein" value="5700">
</form>
<script>
var ff = document.form.reservein.value;
// 비교구문은 1000보다 작은지 또는 아래처럼 000 일치한지 처럼 자신의 코딩 스타일로 구현하면됨. ^^
if(ff.substr((ff.length-3) != "000") {
  alert("1,000원 단위로 입력하세요!");
}
</script>

자바스크립트 팝업 화면 가운데 띄우기

웹프로그램

<script language='javascript'>
<!--
function popup_news(linkurl)
{
 var width       = 1024;
 var height      = 768;
 var left        = (screen.width) ? (screen.width-width)/2 : 0;
 var top         = (screen.height) ? (screen.height-height)/2 : 0;
 var position    = 'top='+top+',left='+left+',width='+width+',height='+height+',resizable=no,scrollbars=yes,menubar=no,toolbar=no,status=0';
 var win_news    = window.open(linkurl,'pop_news_window',position);
 win_news.focus();
}
//-->
</script>

위 글은 세이박스에서 직접 작성한 것으로 퍼가실 경우 반드시 출처와 함께 남기시길 바랍니다.
출처 : 세이박스 http://saybox.tistory.com/

자바스크립트 접속자의 동작 이벤트를 감지 하여 다른 이벤트 처리하기

웹프로그램

추가적인 이벤트를 발생 시킬수 있는 함수

<script type="text/javascript" language="javascript">
function initPage()
{
 <c:if test="${param.subject_cd!=null}">
 viewStudyList('<c:out value="${param.subject_cd}"/>');
 </c:if>
}

window.attachEvent("onload",initPage);
</script>

window.attachEvent();함수에서 onload시에 initPage()함수를 호출하여
추가적인 이벤트를 발생 할 수 있게된다

자바스크립트 주민번호,외국인번호,사업자번호 체크 Script

웹프로그램


주민번호,외국인번호,사업자번호 체크 Script
1. 주민등록번호
2. 재외국인 등록번호
3. 사업자등록번호
등의 진위 여부를 체크할 수 있는 JavaScript입니다.
(정통부(?)에서 공개되어있던 스크립트일겁니다...)
사용법은
check_fgnno('외국인번호13자리');
check_juminno('주민번호13자리');
check_busino('사업자번호10자리');
----------------------------------------------------
<!--
// 재외국인 번호 체크
function check_fgnno(fgnno) {
        var sum=0;
        var odd=0;
        buf = new Array(13);
        for(i=0; i<13; i++) { buf[i]=parseInt(fgnno.charAt(i)); }
        odd = buf[7]*10 + buf[8];
        if(odd%2 != 0) { return false; }
        if( (buf[11]!=6) && (buf[11]!=7) && (buf[11]!=8) && (buf[11]!=9) ) {
                return false;
        }
        multipliers = [2,3,4,5,6,7,8,9,2,3,4,5];
        for(i=0, sum=0; i<12; i++) { sum += (buf[i] *= multipliers[i]); }
        sum = 11 - (sum%11);
        if(sum >= 10) { sum -= 10; }
        sum += 2;
        if(sum >= 10) { sum -= 10; }
        if(sum != buf[12]) { return false }
        return true;
}
// 주민번호 체크
function check_juminno(juminno) {
        if(juminno=="" || juminno==null || juminno.length!=13) {
                alert("주민등록번호를 적어주세요.");
                return false;
        }
        var jumin1 = juminno.substr(0,6);
        var jumin2 = juminno.substr(6,7);
        var yy         = jumin1.substr(0,2);        // 년도
        var mm = jumin1.substr(2,2);        // 월
        var dd = jumin1.substr(4,2);        // 일
        var genda = jumin2.substr(0,1);        // 성별
        var msg, ss, cc;
        // 숫자가 아닌 것을 입력한 경우
        if (!isNumeric(jumin1)) {
                alert("주민등록번호 앞자리를 숫자로 입력하세요.");
                return false;
        }
        // 길이가 6이 아닌 경우
        if (jumin1.length != 6) {
                alert("주민등록번호 앞자리를 다시 입력하세요.");
                return false;
        }
        // 첫번째 자료에서 연월일(YYMMDD) 형식 중 기본 구성 검사
        if (yy < "00" || yy > "99" ||
                mm < "01" || mm > "12" ||
                dd < "01" || dd > "31") {
                alert("주민등록번호 앞자리를 다시 입력하세요.");
                return false;
        }
        // 숫자가 아닌 것을 입력한 경우
        if (!isNumeric(jumin2)) {
                alert("주민등록번호 뒷자리를 숫자로 입력하세요.");
                return false;
        }
        // 길이가 7이 아닌 경우
        if (jumin2.length != 7) {
                alert("주민등록번호 뒷자리를 다시 입력하세요.");
                return false;
        }
        // 성별부분이 1 ~ 4 가 아닌 경우
        if (genda < "1" || genda > "4") {
                alert("주민등록번호 뒷자리를 다시 입력하세요.");
                return false;
        }
        // 연도 계산 - 1 또는 2: 1900년대, 3 또는 4: 2000년대
        cc = (genda == "1" || genda == "2") ? "19" : "20";
        // 첫번째 자료에서 연월일(YYMMDD) 형식 중 날짜 형식 검사
        if (isYYYYMMDD(parseInt(cc+yy), parseInt(mm), parseInt(dd)) == false) {
                alert("주민등록번호 앞자리를 다시 입력하세요.");
                return false;
        }
        // Check Digit 검사
        if (!isSSN(jumin1, jumin2)) {
                alert("입력한 주민등록번호를 검토한 후, 다시 입력하세요.");
                return false;
        }
        return true;
}
// 사업자등록번호 체크
function check_busino(vencod) {
        var sum = 0;
        var getlist =new Array(10);
        var chkvalue =new Array("1","3","7","1","3","7","1","3","5");
        for(var i=0; i<10; i++) { getlist[i] = vencod.substring(i, i+1); }
        for(var i=0; i<9; i++) { sum += getlist[i]*chkvalue[i]; }
        sum = sum + parseInt((getlist[8]*5)/10);
        sidliy = sum % 10;
        sidchk = 0;
        if(sidliy != 0) { sidchk = 10 - sidliy; }
        else { sidchk = 0; }
        if(sidchk != getlist[9]) { return false; }
        return true;
}

function isYYYYMMDD(y, m, d) {
        switch (m) {
        case 2:        // 2월의 경우
                if (d > 29) return false;
                if (d == 29) {
                        // 2월 29의 경우 당해가 윤년인지를 확인
                        if ((y % 4 != 0) || (y % 100 == 0) && (y % 400 != 0))
                                return false;
                }
                break;
        case 4:        // 작은 달의 경우
        case 6:
        case 9:
        case 11:
                if (d == 31) return false;
        }
        // 큰 달의 경우
        return true;
}
function isNumeric(s) {
        for (i=0; i<s.length; i++) {
                c = s.substr(i, 1);
                if (c < "0" || c > "9") return false;
        }
        return true;
}
function isLeapYear(y) {
        if (y < 100)
        y = y + 1900;
        if ( (y % 4 == 0) && (y % 100 != 0) || (y % 400 == 0) ) {
                return true;
        } else {
                return false;
        }
}
function getNumberOfDate(yy, mm) {
        month = new Array(29,31,28,31,30,31,30,31,31,30,31,30,31);
        if (mm == 2 && isLeapYear(yy)) mm = 0;
        return month[mm];
}
function isSSN(s1, s2) {
        n = 2;
        sum = 0;
        for (i=0; i<s1.length; i++)
                sum += parseInt(s1.substr(i, 1)) * n++;
        for (i=0; i<s2.length-1; i++) {
                sum += parseInt(s2.substr(i, 1)) * n++;
                if (n == 10) n = 2;
        }
        c = 11 - sum % 11;
        if (c == 11) c = 1;
        if (c == 10) c = 0;
        if (c != parseInt(s2.substr(6, 1))) return false;
        else return true;
}
//-->

자바스크립트 새로고침또는 창닫기시 이벤트 처리하기

웹프로그램

브라우저가 닫힐때 새로운 새창을 띄우거나 이벤트를 처리하고자 할때

<script language="javascript">
 function closeWindow() {
  // 창 닫힘
  if (self.screenTop > 9000) {
           alert('창닫힘');
  } else {
   // 새로고침
   if(document.readyState == "complete") {
             alert('새로고침');
   // 다른 사이트로 이동
   } else if(document.readyState == "loading") {
             alert('창이동');
   }
  }
 }
</script>

<body onunload="javascript:closeWindow()" >
</body>

자바스크립트 div 숨기기 보여주기

웹프로그램
<script language=JavaScript>
function Show(divid) {
  divid.style.visibility = "visible";
}
function Hide(divid) {
  divid.style.visibility = "hidden";
}
</script>

자바스크립트 레이어 팝업소스 오늘하루 이창열지 않기

웹프로그램

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
<script language="JavaScript1.2">
isIE=document.all;
isNN=!document.all&&document.getElementById;
isN4=document.layers;
isHot=false;
function ddInit(e){
  topDog=isIE ? "BODY" : "HTML";
  whichDog=isIE ? document.all.theLayer : document.getElementById("theLayer");
  hotDog=isIE ? event.srcElement : e.target;
  while (hotDog.id!="titleBar"&&hotDog.tagName!=topDog){
    hotDog=isIE ? hotDog.parentElement : hotDog.parentNode;
  }
  if (hotDog.id=="titleBar"){
    offsetx=isIE ? event.clientX : e.clientX;
    offsety=isIE ? event.clientY : e.clientY;
    nowX=parseInt(whichDog.style.left);
    nowY=parseInt(whichDog.style.top);
    ddEnabled=true;
    document.onmousemove=dd;
  }
}
function dd(e){
  if (!ddEnabled) return;
  whichDog.style.left=isIE ? nowX+event.clientX-offsetx : nowX+e.clientX-offsetx;
  whichDog.style.top=isIE ? nowY+event.clientY-offsety : nowY+e.clientY-offsety;
  return false;
}
function ddN4(whatDog){
  if (!isN4) return;
  N4=eval(whatDog);
  N4.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
  N4.onmousedown=function(e){
    N4.captureEvents(Event.MOUSEMOVE);
    N4x=e.x;
    N4y=e.y;
  }
  N4.onmousemove=function(e){
    if (isHot){
      N4.moveBy(e.x-N4x,e.y-N4y);
      return false;
    }
  }
  N4.onmouseup=function(){
    N4.releaseEvents(Event.MOUSEMOVE);
  }
}
function hideMe(){
  if (isIE||isNN) whichDog.style.visibility="hidden";
  else if (isN4) document.theLayer.visibility="hide";
}
function showMe(){
  if (isIE||isNN) whichDog.style.visibility="visible";
  else if (isN4) document.theLayer.visibility="show";
}
document.onmousedown=ddInit;
document.onmouseup=Function("ddEnabled=false");
function notice_setCookie( name, value, expiredays )
{
        var todayDate = new Date();
        todayDate.setDate( todayDate.getDate() + expiredays );
        document.cookie = name + '=' + escape( value ) + '; path=/; expires=' + todayDate.toGMTString() + ';'
 return;
}
function notice_getCookie( name )
{
  var nameOfCookie = name + "=";
  var x = 0;
  while ( x <= document.cookie.length )
  {
   var y = (x+nameOfCookie.length);
   if ( document.cookie.substring( x, y ) == nameOfCookie ) {
    if ( (endOfCookie=document.cookie.indexOf( ";", y )) == -1 )
      endOfCookie = document.cookie.length;
    return unescape( document.cookie.substring( y, endOfCookie ) );
   }
   x = document.cookie.indexOf( " ", x ) + 1;
   if ( x == 0 ) break;
  }
  return "";
}
</script>
 </HEAD>
 <BODY>
     <!-- 레이어 팝업 내용 시작 -->
<div id="theLayer" style="position:absolute;width:400px; visibility:visible; left:100px; top: 100px; display:none;">
<table border="0" width="250" bgcolor="#424242" cellspacing="0" cellpadding="5">
<tr>
    <td width="100%">
        <table border="0" width="100%" cellspacing="0" cellpadding="0" height="36">
        <tr>
            <td id="titleBar" style="cursor:move" width="80%">
            <ilayer width="100%" onSelectStart="return false">
            <layer width="100%" onMouseover="isHot=true;if (isN4) ddN4(theLayer)" onMouseout="isHot=false">
            <font face="Arial" color="#FFFFFF">팝업내용</font>
            </layer>
            </ilayer>
            </td>
            <td style="cursor:hand" valign="top" width="20%" align="right">
            <a href="#" onClick="hideMe();return false"><font color=#ffffff size=2 face=arial  style="text-decoration:none"><font color=#ffffff size=2 face=arial  style="text-decoration:none">X </font></a>
            </td>
        </tr>
        <tr>
            <td width="100%" bgcolor="#FFFFFF" style="padding:14px" colspan="2"><p><img src="<?=$myurl?>/images/popup.jpg" border="0"><p/></td>
        </tr>
  <tr><td height="5"></td>
  </tr>
  <tr><td align=center width="400"><INPUT TYPE="checkbox" NAME="popupCookie" onclick="notice_setCookie('popup','done',1);hideMe();"> <FONT COLOR="#FFFFFF">하루동안 이창 보이지 않기</FONT></td>
  </tr>
        </table>
    </td>
</tr>
</table>
</div><!-- 레이어 팝업 내용 끝 -->
<script type="text/javascript">
 if(notice_getCookie("popup") != "done") theLayer.style.display="block";
</script>
 </BODY>
</HTML>

자바스크립트 하루동안 안 열리는 팝업

웹프로그램


<html>
<head>
<script>
function window.onload(){ //페이지 로드 시 팝업 띄움.
   var cookie= getCookie("CookieName");
 
   if (cookie!= "noPopup") { //창 닫기를 체크하지 않았으면 팝업 띄움.
    var url = "popup.htm";
    window.open(url, null, "width=500, height=500");
   }
}
 function getCookie(name) { //쿠키 가져오기
  var Found = false;
  var start, end;
  var i = 0;
 
  while(i <= document.cookie.length) {
   start = i
   end = start + name.length
 
   if(document.cookie.substring(start, end) == name) {
    Found = true;
    break;
   }
   i++;
  }
 
  if(Found == true) {
   start = end + 1;
   end = document.cookie.indexOf(";", start);
 
   if(end < start) {
    end = document.cookie.length;
   }
   return document.cookie.substring(start, end)
  }
  return "";
 }
</script>
</head>
<body>
팝업 띄울 페이지
</body>
</html>
 
다음은 팝업 페이지.
 
<html>
<head>
<script>
function setCookie( name, value, expiredays ) { //쿠키 설정
 var todayDate = new Date();
 todayDate.setDate( todayDate.getDate() + expiredays );
 document.cookie = name + "=" + escape( value )
 + "; path=/; expires=" + todayDate.toGMTString() + ";"
}
function closeWindow()  {
 var check = document.getElementById("event"); //event라는 이름의 체크박스를 가져옴.
 if (check.checked)  { //체크박스가 선택되어 있으면
  setCookie("CookieName", "noPopup" , 1); //쿠키 이름을 'noPopup'으로 설정.
 }
 self.close(); //팝업창을 닫는다.
}
</script>
</head>
<body>
<input type="checkbox" name="event" onclick="javascript:closeWindow();"/>닫기
</body>
</html>

자바스크립트 location 으로 새창 띄우기

웹프로그램
보통 스크립트 상으로 팝업(popup) 으로 많이 띄우지만
새창을 띄울땐 href="" target="_blank" 로써 새창을 띄우도록 합죠
 
하지만 때론 스크립트 function 함수 내에서 새창을 띄우고자 할때가있겠제
간단합니다.
 
window.open('유알엘','_blank');
 
window.open 에 '_blank' 옵션 하나 넣어주는게 끝입니다.

자바스크립트 Internet Explorer 7 에서 self.close 사용하기

웹프로그램
브라우저 버전에 따라 다르게 동작하는 닫기 함수

<script language="javascript">
<!--
if (/MSIE/.test(navigator.userAgent)) {
   //Explorer 7이상일때
   if(navigator.appVersion.indexOf("MSIE 7.0")>=0) {
      window.open('about:blank','_self').close();
   }
   //Explorer 7이하일때
   else {
      window.opener = self;
      self.close();
   }
}
//-->
</script>

자바스크립트 메뉴를 클릭시 div를 보였다 안보였다 하기

웹프로그램

<script language="javascript">
       function best_hide() {
        document.all.best1.style.display="none"; 
        document.all.best2.style.display="none";   
        document.all.best3.style.display="none";
        document.all.best4.style.display="none";
        document.all.best5.style.display="none";      
       }
       function best_show(send) {
        best_hide();
        send.style.display = "";
       }    
</script>
 
//5개의 div 처음 보여줄것 외엔 display:none 처리
<? for($i=1;$i<6;$i++) { ?>
<div id="best<?=$i?>" <? if($i>1) { ?>style="DISPLAY:none"<? } ?>>
 
//5개의 메뉴
<? for($k=1;$k<6;$k++) ?>
<td><a href="#" onfocus='this.blur()' onClick="best_show(best<?=$k?>)"><img src="best_menu_<?=$k?><? if($i==$k>) { ?>b<? } ?>.gif" onmouseover='this.src="best_menu_<?=$k?><? if($i==$k) { ?>b<? } ?>.gif"' onmouseout='this.src="best_menu_<?=$k?><? if($i==$k) { ?>b<? } ?>.gif"' border="0"></a></td>
<? } ?>
 
</div>
<? } ?>
 
메뉴를 누를때 페이지는 그대로이면서 5개의 Div가 클릭한 것만 보이도록 함.

자바스크립트 div를 이용하여 보였다 안보였다 하기 visibility 이용

웹프로그램

<script language="JavaScript">
<!--
    function divView(btnId) {
        var btn = eval("document.images."+btnId);
        var div = eval("document.all.div_"+btnId);
        if(div.currentStyle["visibility"]=="visible") {
            btn.src = "$CTX_ROOT/images/button/btn_plus.gif";  
            div.style.visibility="hidden";
        } else if(div.currentStyle["visibility"]=="hidden") {
            btn.src = "$CTX_ROOT/images/button/btn_minus.gif";
            div.style.visibility="visible";
        }
    }
//-->
</script>

<img src="/images/button/btn_plus.gif" alt="클릭시 하단이 늘어납니다." align="absmiddle" id="btnTotal" style="cursor:hand" onclick="divView(this.id);">
<table id="div_btnTotal" style="visibility:hidden;">
<tr>
  <td>사라졌다 나타났다</td>
</tr>
</table>

자바스크립트 입력 내용이 숫자만 입력했는지 체크

웹프로그램
<script>
function num_chk() {
  var ff = document.form;
  for(i=0;i<ff.inpay.value.length;i++) {
    if (ff.inpay.value.charAt(i)<'0' || ff.inpay.value.charAt(i)>'9') {
      alert("숫자만 입력해주세요.") ;
      return;
    }
  }
}
</script>
 
<form name=form>
<input name=inpay type=test value='abcd'>
</form>
<a href="javascript:num_chk();">테스트</a>

자바스크립트 클립보드에 내용 복사하기

웹프로그램

마우스로 긁거나 버튼을 클릭시 Ctrl + C 를 한 것처럼 클럽보드(임시저장공간) 에 저장한것 같이 하고자 한다면

window.clipboardData.setData('text','저장할 내용');


처럼 할경우 "저장할 내용" 메모리에 저장된다.

위 글은 세이박스에서 직접 작성한 것으로 퍼가실 경우 반드시 출처와 함께 남기시길 바랍니다.
출처 : 세이박스 http://saybox.tistory.com/

자바스크립트 배우기 - Event 잡아내기

웹프로그램

이벤트와 이벤트 핸들러

웹문서를 읽어들일 때라든가, 다른 홈페이지로 이동할 때라든지, 또는 버튼이나 링크위에 마우스를 클릭하거나 위치시킨다던지 하는 이러한 것들이 바로 이벤트이다. 이 파트에서는 넷스케이프 4.0 버전에서 지원하는 자바스크립트 1.2를 중심으로 설명하려한다.

우선 간단하게 이벤트와 이벤트 핸들러의 정의를 확인하자. 이벤트란 사용자가 브라우저 윈도우상에서 버튼을 클릭하거나, 마우스를 움직이거나, 또는 키보드의 키를 누르는 등의 자바스크립트가 인식할 수 있는 행위를 말한다. 자바스크립트가 이러한 이벤트를 인식했을 때 그에 대한 반응으로써 나타나는 것이 이벤트 핸들러이다. 예를 들어 버튼을 클릭했을 때 팝업윈도우가 나타난다면 버튼이 눌려진것은 이벤트이고 팝업윈도우를 띄우는 행위는 이벤트 핸들러이다. 이벤트 핸들러를 쉽게 함수나 메소드라고 생각하면 된다. 그렇다면 자바스크립트가 인식할 수 있는 이벤트에는 과연 어떠한 종류가 있는지를 알아보자.

click
 폼과 같은 입력양식이나 버튼, 링크를 클릭했을 때 발생하는 이벤트
 
dbclick
 폼과 같은 입력양식이나 버튼, 링크를 더블클릭했을 때 발생하는 이벤트
 
mouseover
 링크 위로 마우스 포인터가 위치했을 때
 
mouseout
 마우스 포인터가 링크 밖으로 벗어났을 때
 
mousedown
 마우스버튼을 눌렀을 때
 
mouseup
 마우스버튼을 눌렀다 놓았을 때
 
mousemove
 마우스를 움직일 때
 
keypress
 키보드의 키를 눌렀을 때
 
keyup
 키보드의 키를 눌렀다 놓았을 때
 
load
 웹문서가 읽혀졌을 때
 
unload
 브라우저에서 웹문서가 사라질 때
 

이 이외에도 몇가지의 이벤트가 더 있지만 여기서는 자세하게 언급하지는 않겠다. 이제 이러한 이벤트를 가지고 몇가지의 예제를 보자. 우선 resize 이벤트에 대한 예제를 보자. 다음의 버튼을 클릭하면 새로운 윈도우가 뜰 것이다. 이때 생성되는 이 윈도우의 크기를 변화시키면 자바스크립트가 이를 인식해 인도우의 크기가 변화됐다는 팝업윈도우를 띄울 것이다. 예제를 실행시켜보자.


resize.html

<html>
<head>
     <script language="JavaScript">
     <!--        
          window.onResize = message;      
          function message() {
                        alert("윈도우의 크기가 바뀌는 이벤트가 발생했습니다!");
          }
     // end of script -->
     </script>
</head>
<body>    
      윈도우의 크기를 바꾸어보세요!
</body>
</html>

자, 여기서 아래의 코드를 보자.

        window.onresize = message;

이것은 등호의 왼쪽에서 지정한 이벤트가 발생했을 때 오른쪽에 지정한 이벤트핸들러를 처리하라는 의미이다. 윈도우의 크기가 바뀌었을 때 발생하는 이벤트는 resize이벤트이다. 이 이벤트에 대한 이벤트핸들러를 나타낼 때에는 앞에 on을 덧붙인다. 그래서 resize 이벤트가 발생했을 때 자바스크립트는 이를 감지하고 이벤트핸들러로 지정한 함수 message()를 호출하게 된다. 그래서 함수 message()의 내용에 따라 팝업윈도우가 뜨는 것이다. 여기서 한가지 주의할 것은 이벤트핸들러를 나타낼 때에는 비록 함수를 호출하는 것이지만 ()를 적어서는 안된다. 만일 ()를 함께 적으면 일반 함수호출로 인식되어버리기 때문이다.

이러한 표현방법이 낯설수도 있다. 하지만 지금까지 접했던 이벤트 처리방법의 형식을 기억해보자.  예를 들어 입력양식 내의 버튼을 눌렀을 때 버튼이 눌렸다는 팝업윈도우를 띄우는 경우이다. 코드는 아래와 같을 것이다.

        <form>
        <input type="button" name="myBtn" value="버튼 클릭이벤트 예제"
        onClick="alert('버튼을 누르는 이벤트가 발생하였습니다!')">
        </form>

이와 같은 코드를 앞에서와 같은 이벤트핸들러를 지정해서 써보면 다음과 같다.

        <form>
        <input type="button" name="myBtn"
                value="버튼 클릭이벤트 예제">
        </form>
               ...
       
        <script language="JavaScript">
        <!--
        document.forms[0].myBtn.onClick = message;
                 
        function message() {
                alert('버튼을 누르는 이벤트가 발생하였습니다!');
        }
        // end of script -->
        </script>

어떤가? 아마도 여러분은 두 번째 대안이 더 복잡하게 보일 것이다. 그렇다면 왜 resize 예제에서는 이렇게 복잡해 보이는 방법을 사용했을까? 자, 이벤트핸들러는 첫 번째 방법처럼 이벤트 핸들러를 사용하고자 하는 곳에서 HTML 태그의 한속성으로도 지정될 수 있다. 그리고 그때 속성의이름은 해당 이벤트 이름 앞에 on을 붙이면 된다. 그래서 첫 번째에서는 <input> 태그내의 'onClick'속성에서 호출할 함수를 지정하였다. 그러나 맨 처음 resize 예제의 이벤트객체인 윈도우 객체는 태그 내에서 쓰일 수가 없다. 그렇기 때문에 조금은 복잡해 보이는 방법을 사용해야 하는 것이다.

이벤트 객체

이벤트 객체는 넷스케이프 4.0 발표와 함께 제공되기 시작한 자바스크립트 객체이다. 이벤트가 발생할 때마다 이 이벤트객체가 이벤트핸들러에 전달된다.

오른쪽의 이미지 상에 마우스를 놓고 클릭해보자.  그러면 마우스이벤트가 발생한 위치의 좌표를 나타내는 팝업윈도우가 나타날 것이다.

이 예제는 <ilayer> 태그를 사용하므로 넷스케이프 4.0 이상에서만 실행가능하다.

        <ilayer>
        <layer>
        <a href="javascript://" onClick="if (browserOK)
                alert('x 좌표: ' + event.x + '  y 좌표: ' + event.y);
                return false;">
        <img src="davinci.jpg" width=209 height=264 border=0></a>
        </layer>
        </ilayer>

여기서는 <a> 태그내에 onClick 이벤트핸들러를 사용하고 있다. 여기서는 event.x 와 event.y 라는 새로운 이벤트 객체를 사용했는데 이 객체는 해당이벤트가 발생한 위치에서의 좌표를 가지고 있다.

이때 좌표는 브라우저 윈도우를 기준으로 하지 않고 레이어를 기준으로 한다. 그리고 이벤트핸들러를 정의할 때에는 리턴값에 주의해야 한다. 즉, 위의 경우와 달리 true를 리턴하게 되면 사용자가 레이어상에서 클릭했을 때 링크되어 있는 문서로 이동하게 된다. 그러나 false를 리턴하게 되면 링크에 연결되어 있는 문서가 나타나지 않고 이벤트가 여기에서 끝나게 된다. 위의 예제에서는 좌표를 얻는 것이 목적이므로 false를 반환하였다.

이벤트객체로는 다음과 같은 것들이 있다.

data
 DragDrop 이벤트로 선택된 객체의 URL 주소
 
layerX
 이벤트가 발생한 위치의 x 좌표. 레이어를 기준으로 한다.
 
layerY
 이벤트가 발생한 위치의 y 좌표. 레이어를 기준으로 한다.
 
pageX
 이벤트가 발생한 위치의 x 좌표. 페이지을 기준으로 한다.
 
pageY
 이벤트가 발생한 위치의 y 좌표. 페이지을 기준으로 한다.
 
screenX
 이벤트가 발생한 위치의 x 좌표. 화면을 기준으로 한다.
 
screenY
 이벤트가 발생한 위치의 y 좌표. 화면을 기준으로 한다.
 
which
 마우스버튼의 종류, 또는 입력키의 ASCII-값
 
modifiers
 마우스와 키 이벤트 발생시 함께 눌려진 modifier 키

예) ALT_MASK, CONTROL_MASK, META_MASK, SHIFT_MASK
 
target
 이벤트가 전달될 객체를 나타내는 문자열
 
type
 이벤트의 종류


이벤트 잡아내기

자바스크립트 1.2 부터는 웹페이지상에서 발생하는 이벤트를 가로챌 수 있게 되었다. 예를들어 지금까지는 사용자가 버튼을 클릭하게 되면 이 버튼의 onClick 이벤트 핸들러가 호출이 된다. 그러나 이제 자바스크립트를 이용하면 이벤트가 버튼과 같은 대상객체에 의해 처리되기전에 이 이벤트를 가로챌 수 가 있게 되었다.

이를 이용하면 일정조건이 만족되지 않은 상태에서 버튼이나 링크가 클릭되지 못하게 한다든가, 키가 객체에 입력되지 못하게 한다든가 하는 등의 작업을 수행할 수 가 있다. 다음의 예제를 보며 이를 확인하자.

 event_capture.html

<html>
     <script language="JavaScript">
     <!--
          window.captureEvents(Event.CLICK);                
          window.onclick = message;
          function message(e) {
                        alert("연결되어 있는 문서로 넘어가기전에 이벤트를 잡았습니다!");
                        return routeEvent(e);
          }  
           // end of script -->
    </script>             
<body>
<form>
        <a href="test.html" onClick="alert('연결문서로 넘어갑니다')">
         이 링크를 클릭하세요!</a>
</form>
</body>
</html>

자바스크립트 특정 부분 클릭시 스크립트 함수 호출하기

웹프로그램
 
<div id="ddd" onClick="log_check()"><a href="..."><img src="...."></a></div>
 
위 처럼 DIV로 묶어 버리면 링크를 클릭하더라도 log_check() 함수를 먼저 호출한 다음 링크로 이동하게 됨.

자바스크립트 팝업창에서 부모 페이지 reload 하기

웹프로그램
<script>
opener.location.reload();
</script>

자바스크립트 쿠키를 서브 도메인 공유하기

웹프로그램
function SetCookie(sName, sValue)
{
 var expDays = 7; // 쿠키 만료기간(일수)
 var todayDate = new Date();
 var cookiePath = "/";
 var domain = "gooddaysports.co.kr";
 todayDate.setDate(todayDate.getDate() + expDays);
 if (sValue == "1") {
   document.cookie = sName + "=" + escape(sValue);
  } else if (sValue == "2") {
   document.cookie = sName + "=" + escape(sValue) + ";" +
    "expires=" + todayDate.toGMTString() + ";" +
    "path=" + cookiePath + ";" +
  "domain=" + domain + ";"
  }
}
var pID = "goodday";
 
ㅜㅜ 도메인관련 찾느라 고생했음.....
http://www.gooddaysports.co.kr 에서 goodday라고 굽은 쿠키가
http://w1.gooddaysports.co.kr 에서 사용 할려면
위 var domain = "gooddaysports.co.kr" 라고 지정해줘야함.
앞에 어떤 서브 도메인이 되었던 gooddaysports.co.kr 도메인에서 동일하게 쿠키를 공유함.

위 글은 세이박스에서 직접 작성한 것으로 퍼가실 경우 반드시 출처와 함께 남기시길 바랍니다.
출처 : 세이박스 http://saybox.tistory.com/

자바스크립트 여러도메인 하나의 쿠키로 적용하기 [setcookie 함수]

웹프로그램
일반적으로 홈페이지 주소는 두가지 형태로 됩니다.

도메인이 koso.net 일 경우
http://koso.net
http://www.koso.net

보통 이 두가지가 웹 주소로 많이 쓰이겠죠.

그런데 쿠키를 적용은 어떤 도메인으로 했냐에 따라서 서로 틀린것으로 인식합니다.

즉 http://koso.net 에서의 쿠키값과
http://www.koso.net 에서의 쿠키값은 엄연히 틀립니다.

그러나 이 두가지의 도메인(그외의 도메인도 적용가능)을 하나의 쿠키로 적용 시키려면 쿠키를 만드는 setcookie 함수에 마지막 인자를 추가해 주면 해결 됩니다.

setcookie(쿠키이름,쿠키값,쿠키유지시간,쿠키적용경로,쿠키해드);

1. setcookie("userid","koso"," ","/");
2. setcookie("userid","koso"," ","/","koso.net");

1번이 일반적인 경우이고 2번이 두개 이상의 도메인에 적용할때 항상 koso.net 이라는 해드를 가지고 만들라는 것입니다.

문의 사항은 pro@koso.net 으로 해주세요. 감사합니다.

출처 : http://cafe.naver.com/lpion.cafe?iframe_url=/ArticleRead.nhn%3Farticleid=9

자바스크립트 키(Cookie) 취약점

웹프로그램
말도많고 탈도많은 쿠키!! 어떻게 사용하면 잘사용 하는걸까요?
앞으로 나오는 no_document.cookie등은 자동으로 "no_"앞에 가 붙습니다
Unicorn3에서 보안상 필터링하게 되어있기 때문입니다 앞에 "no_"가 없는것으로 간주하시면 됩니다

쿠키취약점
쿠키로 인증하는 사이트에 접속하여 로그인한 후 쿠키값 확인을 해봅니다
javascript-x:alert(no_document.cookie)

로그인 하지 않은 상태라면 다음과 같이 세션 아이디만 나오게 되며


로그인 한 상태라면 다음과 같이 쿠키이름과 쿠키값을 쌍으로 정보가 출력됩니다



관리자 아이디가 goodbug 라고 가정하고 이 아이디로 조작하기 위해서는 다음과 같이 입력합니다
javascript-x:a=prompt(no_document.cookie,"");alert(no_document.cookie=a)

그럼 프롬프트창이 하나 나타나며 이 부분에 다음과 같이 입력합니다


어떤 쿠키이름이 아이디를 나타내는 것일까요?
몇가지 없으니 가장 유력한 이름부터 하나씩 해보면 됩니다
UID=goodbug

다시 javascript-x:alert(no_document.cookie) 를 통해 쿠키값을 확인합니다

UID가 goodbug로 변경이 되었습니다
즉 내계정을 통해 goodbug로 로그인한것과 동일한 효과를 가져왔습니다!!
만약 쿠키로만 인증하는 방식이라면 타계정의 접속이나 관리자 화면으로 쉽게 들어갈 수 있습니다


 쿠키를 이용한 SQL Injection
쿠키를 이용하여 일반 로그인 화면이나 관리자 화면을 통화할 수 있습니다
SQL Injection이 어느정도 알려졌기 때문에 로그인 폼으로 부터 넘어온 아이디나 비밀번호 정보들을
일정 값들로 치환하는 경우를 볼 수 있습니다
즉 '나 ", -, #등의 SQL Injection에 활용되는 문자들을 무력화 시키곤 합니다
하지만 이역시 쿠키 SQL Injection을 통해 간단히 통과할 수 있습니다

마찬가지 방법으로 자신의 계정으로 로그인 하여 쿠키를 생성 한 후 다음과 같이 값을 변경합니다
UID=goodbug' or 1=1 --
관리자 화면은 화면마다 아이디를 이용해 인증을 할것입니다
하지만 이 관리자 아이디를 쿠키로 읽어온다면 아마 많은 허점이 생길겁니다
보통 쿠키로 부터 읽어온 값은 '나 --등은 체크하지 않죠
그래서 인증 관련된 부분은 항상 "특정문자를 치환+Statement" 보다는 "PreparedStatement"를 사용해야 합니다


 쿠키취약점 보안 및 결론
 -. 쿠키에 값을 구울때는 그 값을 "암호화" 하여 저장하고, 다시 읽어올때는 "역암호화"하여 사용합니다
 -. 로그인시에 IP도 쿠키에 같이 구워버리고, 데이터베이스에도 저장하며, 항상 실제 아이피와 비교하여 사용합니다
 -. 쿠키는 웹서버가 클라이언트에 남겨놓은 정보입니다
     그래서 쿠키는 클라이언트가 마음대로 조작하는것이 가능하기때문에 서버는 어떤일이 일어나는지 검사해야 한다는 것입니다

ps. 대형사이트에서는 IDS에 걸릴수 있으니 주의하세요

=============================================
본문서는 자유롭게 배포/복사 할수 있지만
이문서의 저자에 대한 언급을 삭제하시면 안됩니다
저자 : GoodBug (unicorn@jakartaproject.com)
=============================================

자바스크립트 네이버에서 이미지 클릭 하면 본창에서 확대되는 기능입니다.

웹프로그램

<img src="http://blogfiles13.naver.net/data28/2008/1/10/44/wehrwolf_1_kifv604.jpg" width="547" height="1730" style="cursor: pointer;" onclick="popview(this)">
 
function popview(imgObj){
 var url = "";
    if(typeof imgObj == 'string'){
     url = imgObj;
    }else if(typeof imgObj == 'object' && imgObj.parentNode != "undefined" && imgObj.src != "undefined"){
        if(imgObj.parentNode.tagName == 'A'){
         return;
        }else{
            url = imgObj.src;
        }
    }
    mlayoutPhoto.doPlayer([url], 0);
 //window.open("http://blog.naver.com/main/imageZoom.jsp?url=" + url,"mainview","scrollbars=yes,width=100,height=100");
}
 
<!-- 레이아웃포토용 이미지 팝업 통화면 처리 -->
<script type="text/javascript" src="http://blog.naver.com/common/js/viewer-1.3.4.1.js"></script>
<script type="text/javascript">
 var viewer_image_url = "http://blogimgs.naver.com/blog20/blog/layout_photo/viewer/";
 var photo = new PhotoLayer(parent);
 photo.Initialized();
 window.onunload = function()
 {
  photo.oPhotoFrame.doFrameMainClose();
  mlayoutPhoto.unload();
 }.bind(this);
</script>

자바스크립트 이미지 리사이징 함수

웹프로그램
페이지를 모두 불러온후 이미지를 페이지 사이즈에 맞게 다시 조절해서 보여주게 하고 싶을때 다음과 같이 하시면됩니다.

 
function resizeImg(imgObj, width, height) {
   if(imgObj.width>width){
   imgObj.width = width;
   }
   if(height!=""){
    if(imgObj.height>height){
    imgObj.height = height;
    }
   }
}
 
<img src="" onLoad="javascript-x:resizeImg(this,520)" border="0">