출처: http://www.phpschool.com/gnuboard4/bbs/board.php?bo_table=tipntech&wr_id=60392&sca=&sfl=wr_subject%7C%7Cwr_content&stx=ssh&sop=and

2000년대 접어들면서 리눅스에서는 암호화 통신인 ssh 사용이 일반화 되었습니다. 그리고 ssh 를 이용하여 ftp 대신 sftp 서비스를 이용하기도 합니다. 저 역시 대부분의 서버작업을 ssh 를 이용하며 ftp 대신 sftp 를 이용합니다. 그런데 윈도우에서는 서버작업시 터미널을 주로 이용하는데 문제는 ftp 였습니다. 그래서 혹시나 sftp 를 지원하는 프로그램이 없나 찾아보게 되었습니다. 윈도우용 ssh 클라이언트 프로그램으로는 대표적으로 putty(ssh) 나 winscp(sftp) 등이 있지만 윈도우 ssh Server 용 프로그램은 본적이 없었던거 같습니다. 구글링을 해보니.. cygwin 으로 openssh 를 동작시키는 방법이 있었지만 http://pigtail.net/LRP/printsrv/cygwin-sshd.html 귀차니즘과 어느정도 아시는 분들이나 문제없이 설치할듯 하고 해서 계속 찾아보니.. 몇가지 프로그램을 발견했지만 대부분 유료가 많았습니다. 그러다 freeSSHd 라는 프로그램을 찾게되었고 그 프로그램을 이용하여 쉽게 구축할수 있더군요. 다음은 freeSSHd 를 이용하여 설치 및 설정을 하는 방법입니다. 테스트환경 : 윈도우 XP 프로페셔널 필요 환경 : NT 계열 freeSSHd Download : http://www.freesshd.com 다운로드에 가시면 하시면 2개의 설치 실행화일을 받으실수 있습니다. freeSSHd.exe 는 ssh server 를 설치하는 install 화일이고 freeUserImport.exe 는 윈도우 계정을 ssh 서버로 접근가능하게 컨버팅해주는 util 입니다. 우선 freeSSHd.exe 를 실행합니다. 설치중에 어려움은 없을거고 설치 중간에 시스템 서비스로 등록하겠느냐고 나오는데 그건 여러분의 판단에 맏기겠습니다. 저같은경우는 등록해서 사용했습니다. 이제 설치가 완료되고 freeSSHd 셋팅을 할 차례입니다. 트레이에 못보던 아이콘이 생기고 클릭하면 freeSSHd 아래와 같이 셋팅창이 뜰겁니다. 1. Server satatus Telnet Server 와 SSH Server 의 실행 과 중지를 하는곳입니다. 2. Telnet 텔넷 서버의 설정을 하는경우 설정합니다. 그러나 텔넷은 권장하지 않습니다. 텔넷을 사용할거라면 굳이 freeSSHd를 설치할 필요가 없죠. 3. SSH Listen address 에서 특정 IP를 지정할수도 있습니다. Max number of connections 설정은 최대 접속갯수를 설정합니다. 0은 제한이 없다는 것입니다. Idle timeout 은 입력이 없으면 얼마후에 접속을 서버쪽에서 종료시키는 기능입니다. 0은 제한이 없습니다. Command shell 은 SSH 접속시 사용할 명령어 실행하기 위한 인터페이스이고 리눅스에서는 shell 이죠. 그외 옵션은 아래와 같이 설정하고.... RSA , DSA 설정은 기본값으로 두고.. 다음 4. Authentication ssh 인증을 어떤식으로 할것이냐는 것입니다. 패스워드 방식과 공개키 방식이 있습니다. 저는 두가지 경우를 모두 선택했습니다. 여기서 Allowed 와 Required 는 차이가 없습니다. 공개키 생성을 이용하기 위해서는 puttygen.exe 를 이용하시면 됩니다. puttygen.exe 다운로드 puttygen.exe 사용방법은 인터넷에도 자료가 많으니 따로 정리하지 않겠습니다. 5. Encryption 어떤 암호화 알고리즘을 사용할것인가를 선택합니다. 6. Tunneling freeSSHd 를 통해 터널링을 지원할것인가의 여부를 설정합니다. 실제 원격에서 putty 등을 통해 터널링을 이용할수있습니다. putty 설정을 통해 외부접속하는 방법은 인터넷에 ssh 터널링으로 검색해보면 될듯하고 스쿨에도 꽤 자료가 있습니다. 7. SFTP sftp 접속시 홈디렉토리를 설정합니다. 여러가지 sftp 프로그램이 있지만 개인적으로는 winscp 를 추천합니다. winscp 다운로드 8. Automatic updates 업데이트 설정입니다. 9. Online users 현재 접속해 있는 User 리스트를 출력합니다. 해당유저를 두번클릭하면 Disconnect 버튼이 활성화 되며 해당 유저의 접속을 강제로 종료시킬수 있습니다. 10. Logging 아래와 같이 체크하면 사용자들의 접속 기록을 확인할수 있습니다. 11. Host restrictions 접속 제한 IP들을 설정하는 곳입니다. tcp_wrapper 와 같은 보안정책을 실행합니다. Allow only these IP addresses : 전체를 막고 지정한 특정 IP의 접속을 허용합니다. Refuse these IP addresses : 전체를 풀고 지정한 특정 IP의 접속을 차단합니다. 12 Users 현재 등록된 User를 등록, 수정, 삭제 할수 있습니다. Add 를 클릭하게 되면 아래와 같이 새창이 뜹니다. Login  : ID입력 Authorization : 인증은 윈도인증, 패스워드, 공개키인증방식을 선택할수 있습니다. 패스워드 방식을 선택하면 패스워드 입력창이 활성화 됩니다. 여기까지 설정이 되었다면 freeSSHd 의 셋팅이 모두 끝났습니다. 하지만 일반적인 경우 접속이 되지 않습니다. 그건 윈도우의 방화벽 때문입니다. 대부분의 분들은 잘 아실거라 생각하지만 혹시 잘모르시는 분들도 있다고 보고 윈도우 방화벽에서 22번 포트를 푸는 방법을 설명하자면... 제어판 => Windows 방화벽 => 고급탭 선택 후 설정하려는 연결설정을 선택한후 설정을 클릭 => 고급설정창이 뜨고 추가 버튼을 클릭한후 아래의 이미지에 나와있는것처럼 설정을 하시면됩니다.

출처: http://weezzle.net/1395

=======================================================================================

레이어는 기존의 창에 투명한 창을 겹쳐놓은것과 같은 기능을 하는것입니다.

즉 투명한 창에 그림이나 글자같은 요소를 넣을수 있고 또 그것은 기존창과 독립적으로 배치가 가능하고

또 움직이는 애니메이션효과까지 적용할수 있습니다.

단 이런 레이어를 사용하게 되면 문서의 요소들을 사용자의 의도대로 배치할수 있기때문에 많이 사용하지만

브라우저마다 지원하는 태그가 약간씩 다르기 때문에 주의하셔야 합니다.

여기서는 익스플로러와 넷스케이프에서 공통적으로 사용할수 있는 레이어태그를 기준으로 설명하겠습니다.

=======================================================================================

 <Div>레이어를 만들어주는 태그
 
 레이어를 만들어 주려면 <Div>태그안에 position:absolute라는 스타일을 적용시켜야 합니다.
여기서 <Div>태그는 그안의 내용을 문단으로 나누어 주는 역할을 하는 태그입니다.

그 태그에 position:absolute속성을 주어야만 비로소 레이어의 역할을 하게 되는 것입니다.

<Div>태그에 id라는 속성을 사용하여 레이어의 이름을 표시할수 있습니다.

즉 레이어가 여러개일때 각각을 구분해지는 표시가 되는것이죠.

 레이어를 삽입하는 형태는 다음과 같습니다.

<Style type="text/css">
      #이름{ position:absolute; }
</Style>
:
:
<Div id="이름">레이어안에 들어갈 내용</Div>

=======================================================================================

 LEFT / TOP
 
 left와 top속성은 레이어의 위치를 설정하는 것으로 그 속성값은 left 는 브라우저

좌측경계으로부터의 거리..top은 브라우저 상단경계로 부터의거리를 각각 수치로 입력하면 됩니다.

그 표현은 다음과 같습니다.
그 의미는 브라우저 상단과 좌측으로부터 100픽셀씩 떨어진 곳에 임의의 레이어를 만든다는 것입니다.

#이름 { position:absolute; left:100px; top:100px; }

 =======================================================================================

 WIDTH / HEIGHT : 너비와 높이
 
 width와 height속성은 레이어의 크기를 설정하는 속성입니다.

속성값으로 width는 레이어의 너비를 height는 레이어의 높이를 수치로 입력하면 됩니다.

그 표현은 다음과 같습니다. 그 의미는 너비200px, 높이200px의 레이어를 만든다는 것입니다

#이름 {position:absolute; width:200px; height:200px;}

 =======================================================================================

 BACKGROUND-COLOR : 배경색
 
 background-color속성은 레이어의 배경색을 설정하는 속성입니다.

속성값으로 색이름이나 RGB색상코드를 입력합니다.

그 표현은 다음과 같습니다. 그 의미는 레이어의 배경색을 검은색으로 설정한다는 것입니다.

#이름 {position:absolute; background-color:black; }
 
=======================================================================================

 BACKGROUND-IMAGE : 배경이미지
 
 background-image속성은 레이어의 배경이미지를 설정하는 속성입니다.

속성값으로 url(배경이미지경로및파일명)을 가집니다.

그 표현은 다음과 같습니다. 그 의미는 레이어의 이미지를 1.gif로 설정한다는 것입니다.

#이름 {position:absolute; background-image:url(1.gif); }

 =======================================================================================

VISIBILITY
 
visibility속성을 사용해서 레이어를 보여줄것인지 또는 감출것인지를 설정하는 속성입니다.

속성값으로 hidden과 visible를 가지는데.. hidden은 레이어를 보이지 않게 visible은 레이어를 보이게 설정해줍니다.

그 표현은 다음과 같습니다. 그 의미는 레이어를 감춘다는 의미입니다.

#이름 {position:absolute; visibility:hidden; }
 
=======================================================================================

 Z-INDEX : 레이어상하관계
 
레이어를 문서에 넣어줄때는 한꺼번에 여러개의 레이어를 넣는 것도 가능합니다.

레이어는 투명한 창을 겹쳐놓은것과 같다 말씀드렸습니다.

당연히 레이어의 내용이 서로 겹치게 되면 위쪽에 있는 레이어의 내용이 보이게 되겠죠??

 z-index속성은 레이의 상하관계를 숫자로 설정해주는 속성으로 속성값의 숫자가 클수록

위쪽에 배치된다고 생각하시면됩니다.

즉 z-index의 속성값이 클수록 우선적으로 보여지는 것이죠..

그 표현은 다음과 같습니다.

#이름 {position:absolute; z-index:3;}
 
=======================================================================================

 CLIP
 
clip속성을 사용하게 되면 레이어의 일부분만 보여줄수 있습니다.

즉 일정영역을 설정하여 그 부분만 보여주고 나머지 부분은 보이지 않게 설정하는 것입니다.

그 속성값으로 일정영역을 설정하는 rect값을 가지는데.. rect()괄호안에는 4개의 좌표값이 순서대로 들어갑니다.

rect()괄호안에 들어갈 좌표가 잘못설정되면 안되니 주의해서 보세요..

첫번째 들어갈 좌표는 레이어 왼쪽경계로부터 보여줄영역의 왼쪽경계까지 거리
두번째 들어갈 좌표는 레이어 왼쪽경계로부터 보여줄영역의 오른쪽경계까지 거리
세번째 들어갈 좌표는 레이어 상단경계로부터 보여줄영역의 하단경계까지 거리
네번재 들어갈 좌표는 레이어 상단경계로부터 보여줄부분의 상단 경계까지 거리

그 표현은 다음과 같습니다.

의미는 레이어의 상단으로부터 50픽셀, 레이어 왼쪽으로부터 50픽셀 떨어진 거리에 가로200, 세로50만큼의 영역만 보여준다는 것입니다.

#이름 {position:absolute; clip:rect(50 250 100 50);}
 
=======================================================================================

출처 : http://blog.naver.com/eroicaplus?Redirect=Log&logNo=90036328974

출처 :http://www.javascriptkit.com

Document Object Methods

Document object methods

Note: See also JavaScript document object.

출처: http://user.chol.com/~c647/

tomcat 5.5.x 버전에서.

1. tomcat홈/conf/web.xml 파일을 수정한다.

<!--
    <servlet>
        <servlet-name>invoker</servlet-name>
        <servlet-class>
          org.apache.catalina.servlets.InvokerServlet
        </servlet-class>
        <init-param>
            <param-name>debug</param-name>
            <param-value>0</param-value>
        </init-param>
        <load-on-startup>2</load-on-startup>
    </servlet>
-->

<!--
    <servlet-mapping>
        <servlet-name>invoker</servlet-name>
        <url-pattern>/servlet/*</url-pattern>
    </servlet-mapping>
-->

주석 처리된 2부분을 해제한 후 저장

2. /apache-tomcat-5.5.23/webapps/ROOT/WEB-INF 밑에 classes 디렉토리 생성 후

HelloWorld.java 를 넣어 둔다. 컴파일해서 HelloWorld.class 파일을 생성한다.

3. 톰캣을 재시동한다.

4. 웹사이트에서 확인한다.

http://사이트홈/servlet/HelloWorld

수많은 삽질 끝에 APM_SETUP6.0과 Tomcat6.0을 연동하는데 성공해서 이와 관련된 내용을 정리해서 올리고자 한다. 나와 비슷하게 많은 사람들이 삽질을 할 수 있을 듯 한데, 조금이나마 도움이 되었으면 좋겠다.

먼저 웹에서 받을 수도 있겠지만, 일단 본인이 사용한 파일들을 올려두겠다. 현재 날짜로 (2008년 02월 18일) 최신 릴리즈를 사용한 것들이라 추후에는 사라질 수도 있을 것 같다. 그리고 이전 버젼들과는 파일들이 서로 호환되지 않는다고 하니 파일들의 버젼도 유의해서 확인해야할 것 같다.

• APM_Setup6
  저작권 문제가 있으니 링크를 올려둔다. (사실은 파일 용량이 커서 안올라간다. ^^;) APM_Setup6_2007101200 버젼을 사용해서 http://apmsetup.com/download.php?ct=74 에 가서 받을 수 있다.
• Tomcat6.0
  파일은 http://tomcat.apache.org/ 에 가면 최신 버젼을 받을 수 있는데, 혹시 모르니 본인이 사용한 파일을 올려둔다.
  
  apache-tomcat-6.0.16.exe
• JK1.2
  파일은 http://tomcat.apache.org/download-connectors.cgi 에서 받을 수 있는데, 본인이 사용한 버젼을 첨부한다.
  
  mod_jk-1.2.26-httpd-2.2.4.so

먼저 위의 파일들을 적당한 폴더에 받아두고, 설치와 설정을 다음 순서와 같이 진행하면 된다.

0. JDK 설치
java기반의 Tomcat을 구동해야하기 때문에 JDK는 기본적으로 설치가 되어 있어야 한다. 본인은 JDK6.0을 설치했다.

1. APM 설치
내려 받은 APM을 클릭하여 설치하면 된다. 설치는 아주 간단히 되므로 굳이 상세히 언급하진 않겠다. 다만 본인은 C:\APM_Setup 이 root directory가 되도록 설치하였으며 그 외에도 기본 설정을 사용하였다.

2. Tomcat 설치
마찬가지로 간단히 설치하였다. JDK가 설치되었다면 큰 문제 없이 설정된다. 다만 본인은 C:\APM_Setup\Server\Tomcat 6.0 에 설치되도록 하였는데, APM_Setup이 그런 디렉토리 구조를 가지고 있어서 왠지 통일하는게 좋을 것 같아서였다. Tomcat은 파일 복사만으로도 별 문제 없이 실행할 수 있으나, Windows Service로 구동하기 위해서 서비스와 함께 설치되도록 하였다.

3. JK 설정

• mod_jk.so 복사 먼저 내려 받은 jk library를 APM이 설치된 하위의 Apache module 폴더에 복사한다. 이때 파일 이름을 mod_jk.so로 바꾸어 준다. 본인의 경우에는 C:\APM_Setup\Server\Apache\modules\mod_jk.so 파일이 생성되었다. 이후부터는 C:\APM_Setup\Server\Apache를 %APACHE_HOME% 이라 작성하겠다. 설치하는 각자의 Apache가 있는 곳과 대응된다고 보면 된다.
• httpd.conf 설정 다음으로 %APACHE_HOME%\conf\httpd.conf 파일을 수정하여 apache가 jsp를 인식했을 때 tomcat으로 그 처리를 전달하도록 한다. httpd.conf 파일에 다음과 같은 부분들을 추가한다.
  아래에서 붉은색으로 되어 있는 부분들이 중요한 부분들이고 그 외에는 로그와 같은 정보를 확인하도록 설정하는 것이다. tomcat과 관련된 worker를 설정해주기 위해 이와 관련된 파일을 지정하고 설정 정보를 제공해주어야 한다.

##########################################################################
# @START tomcat jk connector
#
# Load mod_jk module
LoadModule jk_module modules/mod_jk.so
# Where to find workers.properties
JkWorkersFile conf/workers.properties
# Where to put jk logs
JkLogFile logs/mod_jk.log
# Set the jk log level [debug/error/info]
JkLogLevel debug
# Select the log format
JkLogStampFormat "[%a %b %d %H:%M:%S %Y] "
# JkOptions indicate to send SSL KEY SIZE,
JkOptions +ForwardKeySize +ForwardURICompat -ForwardDirectories
# JkRequestLogFormat set the request format
JkRequestLogFormat "%w %V %T"
# Send JSPs for context /*.jsp to worker1
JkMount /servlets-examples/* worker1
JkMount *.jsp worker1
#
# @END tomcat jk connector
##########################################################################

• workers.properties 설정 %APACHE_HOME%\conf\workers.properties 파일을 생성하고 해당 worker와 관련된 정보를 지정해준다.

# Define 1 real worker using ajp13
worker.list=worker1
# Set properties for worker1 (ajp13)
worker.worker1.port=8009
worker.worker1.host=localhost
worker.worker1.type=ajp13
worker.worker1.lbfactor=1

이같이 하고, Tomcat과 APM을 구동하면 무리 없이 jsp파일이 처리되는 것을 확인할 수 있다. apache가 jsp파일에 대해서 요청이 오면 tomcat을 호출하는 것이기 때문에 jsp에 대해서는 모두 tomcat의 context path설정을 따라서 진행이 되었다. 예를 들어 /test/index.jsp라고 하면 tomcat의 ROOT 하위의 /test/index.jsp를 호출하게 된다. php나 html은 여전히 apache의 context path를 따르기 때문에 둘간의 혼동을 없애려면 둘의 root directory를 하나로 통일해 두는 것이 좋을 것 같다.

그리고 중요한 것은 혹시나 virtual host를 사용하는 경우에는 JkMount *.jsp worker1 와 같이 worker를 지정할 때 각 virtual host마다 지정해주어야 한다. 본인의 경우 Virtual Host를 사용하였는데, 문제 없이 잘 동작하는 것을 확인할 수 있었다.

보통은 Tomcat으로 작업하면 java 기반으로 하고, APM을 사용하는 경우에는 php를 기반으로 하기 때문에 크게 연동할 일이 없을 것 같은데, 본인의 경우 wiki 기반의 홈페이지에 java 기반의 appliation demo를 보여주기 위해서 연동할 필요가 있었다. 물론 Apache와 Tomcat을 각각 80, 8080 포트에 따로 구동할 수도 있었지만, 본인이 사용하는 Network내에서는 8080포트를 외부로 공개하는 것을 꺼리기 때문에 이같은 연동이 필요했다.
또한 하나의 서버에서 Virtual Host로 두개의 홈페이지를 구동하는 경우에 한 홈페이지는 php기반이고, 다른 홈페이지는 jsp기반이라면 유용하게 적용될 것이라 생각한다. 본인도 아직 설치해보지는 않았지만, 추후 이같은 작업이 필요했기에 연동을 시도했다.

* 참고 사이트
http://tomcat.apache.org/connectors-doc/webserver_howto/apache.html

브라우저의 기본 글꼴크기(1em/100%)를 기준으로한 글꼴 비교표.
pt/px에 익숙한 제작자/사용자는 CSS 초보가 당황할 만한 것 #2를 참고하시기 바랍니다.

관련 URL

• 한글의 웹글꼴 크기 비교
• CSS 초보가 당황할 만한 것 #2
• W3C - CCS2 : Fonts (en)
• W3C - CCS2 : Fonts (ko)

OS에 따른 일반적인 글꼴

신고

의견 쓰기

답변하시면 내공 10점을, 답변이 채택되면 내공 75점(채택25+추가50)을 드립니다.

re: 자바스크립트 로그인폼 아이디저장 기능에 대한 질문입니다. sjisbmoc 답변채택률 76.5% 2007.07.11 10:38

<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
<script>

// 저장할 변수명, 저장할변수, 일자  (1:1일, 2:2일, 365:일년)

function setCookie (name, value, expiredays)
{
 var todayDate = new Date();
 todayDate.setDate( todayDate.getDate() + expiredays );
 document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";";
}

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 '';
}

function setValue()
{
 var fm = document.form;
 setCookie ('user_id', fm.user_id.value, 1);
}

function getValue()
{
 var fm = document.form;
 fm.user_id.value = getCookie('user_id');
}

</script>

 </HEAD>
 <!-- body load 이후 쿠키에 저장된 값을 가져와 ID 값을 적용한다. -->
 <BODY onload='javascript:getValue();'>
  <form name='form'>

   <table>
    <tr>
     <td>
      <input type='text' name='user_id' style='width:100;' maxlength='10'>
      <!-- user_id 값을 쿠키에 저장한다. -->
      <input type='button' name='btn' value='setCookie' onclick='javascript:setValue();'>
     </td>
    </tr>
   </table>

  </form>
 </BODY>
</HTML>

 반듯이 onload 부분에 넣을 필요는 없습니다. 'user_id'  객체가 생성된 후 실행하기

위해서 해당 함수에 넣었을 뿐 특별한 이유는 없습니다.

onload 에 넣지 않을 경우는 user_id 객체가 선언된 이후에 호출 되도록 해야 합니다.

저장할 변수명과 가저올 변수명은

user_id 를 저장할때 쿠키에 저장할 이름을 정해 놓아야 가져올때도 가져 올 수 있기

때문입니다.

학교에서 한반의 학생들에게 번호를 부여하고 번호대로 호출 하듯이

집어넣을때 이름을 붙여넣으면 가져올때 똑같은 이름을 호명해서 쿠키에서

불러올 수 있기때문입니다.

부여하는 이름은 특별히 정해진것은 아니며 쿠키를 제작하는 사람의 기호에 맞춰서

집어넣으면 됩니다. 쿠키에 저장된 변수를 불러올때는 이때 이용한 이름을 이용하여

불러오면 되기때문에 불러올때와 집어넣을때 명칭은 동일하게 됩니다.

신고

의견 쓰기