심플챗 2.0 데모

:: 심플챗 채팅 ::

1. 자료요청

2. 심플챗에 대해
- 심플챗의 기능 / 특징
- 라이센스 정책

3. 설치 메뉴얼
1) 설치전 준비사항
2) 심플챗 서버 설치
3) 심플챗 클라이언트 설치
-클라이언트 설치(PHP)
-제로보드 연동

4. FAQ
- 심플챗 설치 FAQ
- 심플챗 연동 FAQ

5. 묻고답하기

6. 다운로드

7. 심플챗 메인

심플챗 클라이언트 설치와 설정 (Apache, PHP, MySQL 기준)

1. 클라이언트 프로그램을 실행하기 위한 기본환경
2. 파일 다운로드 / 파일 설명
3. 심플챗 클라이언트 환경설정
4. 기본적인 테스트
5. 심플챗과 사이트 연동
6. 사이트온 설치

1. 심플챗 서버 프로그램을 실행하기 위한 환경설정 - 심플챗 클라이언트는 애플릿을 통해 서버와 통신합니다. 따라서 Applet이 실행가능한 브라우져상에서 실행이 됩니다. - 클라이언트는 기본적으로 프레임 구조를 띄게 됩니다. 사용자에게 보이지 않는 빈 프레임에 애플릿과 자바스크립트를 위치시켜 사이트 전체에서 서버와 유기적으로 메세지를 송수신 하도록 되어 있습니다. - 클라이언트에서는 applet와 동일한 포트로 접속할수 있도록 applet 의 PORT param 값을 설정해야 합니다. -

2. 심플챗 파일 다운로드 / 파일 설명 다운로드에서 심플챗 클라이언트 프로그램을 다운받는다. 다운받은 파일은 웹페이지 경로 아무곳이나 설치가 가능하지만, 편의상 Document_Root/simple_client/ 에 설치하도록 합니다. 아래 내용은 simple_client/에 설치된 것을 기준으로 설명합니다. simple_client/+ (simple_client 디렉토리는 다른 디렉토리명으로 지정될수 있다. 코드내에서 몇가지 설정은 변경해야 함) +-- frame_index_sample.html : 사이트 프레임 구조 예제 파일 +-- index.html : 심플챗 페이지 예제 파일 +-- main_sub.php : 심플챗 페이지 예제 파일 +-- webclient.php : 서버와 접속하여 메세지를 보내거나 받는 클라이언트 역활수행 +-- requestOneToOne.php : 데이트 요청 페이지 +-- winOneToOne.php : 데이트 화면 페이지 +-- chat_main.php : 채팅화면 +-- chat_screen.php : 채팅시 화면(초기 채팅화면을 세팅) +-- chat_list.php : 채팅방 사용자 리스트 표시 (수정하지 마세요) +-- room_admin.php : 방장기능 화면 +-- chat_manual.php : 지금 보고 있는 도움말 파일 +-- name_change.php : 대화명 변경 popup 창 +-- capture.php : 갈무리 페이지 파일 +-- save_capture.php : 갈무리 페이지를 저장하는 스크립트 +-- chat_ad.php : 채팅 광고용 전광판 페이지(사용하지 않음) +-- style.css : 웹페이지 스타일 파일 +-- admin_center.php : 관리자용 popup 창 + include/ +-- common_db.php : 공용 db접근용 class 파일 +-- mysql_db.php : mysql db 용 class 파일 +-- oracle_db.php : oracle db용 class 파일 +-- simple_config.php : 서버와 연결을 위한 설정(서버주소, 포트)과 사용자 인증을 가져오는 코드를 포함 +-- simple_lib.php : 심플챗용 라이브러리 파일 + images/ + (이미지 디렉토리) + script/ + (자바 스크립트 디렉토리) + face_icon/ + (대화중 사용하는 얼굴 아이콘 디렉토리) + classes/ + (applet class 파일이 위치한다. simple_client.class) + icon/ + (채팅에 필요한 몇가지 아이콘 이미지들) + util/ + (색선택창) + face_icon + (채팅시 사용되는 얼굴 아이콘) + siteon / +-- siteon.html : 사이트온 기능을 위한 프레임 window +-- user_list.html : 사이트온 사용자 리스트를 표시

3. 심플챗 클라이언트 환경설정 3-1. common_db.php 파일 설정. - 해당 파일에 주석으로 설명되어 있습니다. db서버 접근 정보를 설정하면 됩니다. - common_db.php파일에 이상이 없다면, 심플챗 simple_client/index.html 파일이 화면에 정상적으로 표시됩니다. - SimpleChat_DB 와 Member_DB를 각각 설정할수 있습니다.(보통 둘다 같은 계정정보로 셋팅합니다.) 3-2. simple_config.php - 심플챗에서 상당히 중요한 역활을 하는 파일입니다. 특히 세션과 같이 인증에 관련된 부분은 정확하게 설정하셔야 합니다. 파일내에 따로 주석으로 설명되어 있습니다. - 제로보드일 경우는 따로 설명해 드리겠습니다. - 사이트 로그인후 http://site.domain.name/simple_client/webclient.php을 직접 주소를 입력하여 로그인 세션관련 정보가 표시되는지 확인 3-3. simple_lib.php - db에서 사용자 정보를 가져오는 함수 get_user_info() 를 사이트 정보에 맞게 수정합니다. - 기본 default, 제로보드, 그누보드에 대해서는 소스가 작성되어 있습니다. 세부정보가 추가된 경우 해당 경우에 맞춰 db쿼리를 수정하세요. 기본적으로 아이디, 이름(별명), 나이, 성별, 지역, 레벨 정보를 가져옵니다. * 프레임 지정 - 기본 프레임은 main_frame 과 webclient(simple_client) 프레임으로 이루어진다. - 프레임 관련작업은 모두 webclient 프레임에서 이루어진다. (데이트 신청, 데이트 요청, 1:1 데이트 창 오픈, 쪽지 수신등) - 따라서 채팅서버와의 메세지 호출은 모두 simple_client를 거쳐야 하며, 모든 프레임창에서 지정해야 한다. - main_frame 에서 호출할경우 : top.simple_client.function_name(param1, param2, ...) 으로 호출 - open window 에서 호출할경우 : opener.top.simple_client.function_name(param1, param2, ...) 호출 - open window가 여러번 호출될 경우 : opener.opener... 형식으로 opener를 맞춰 호출함

4. 기본적인 테스트 * 심플챗 클라이언트는 applet과 자바스크립트 연동으로 이루어져 있습니다. 따라서 스크립트 호출에 문제가 있거나, simple_client 윈도우 프레임 지정에 문제가 있으면 정상적으로 작동되지 않습니다. - 클라이언트의 에러는 대부분 자바스크립트에서 윈도우 프레임을 잘못 지정함으로써 발생합니다. * webclient, simple_client - 자바스크립트의 alert() 함수를 이용하여 변수값이나 윈도우 객체가 정상적으로 지정되었는지 확인해볼수 있습니다. webclient.html 이나 index.html 파일에서 alert(webclient); 를 실행시키면, [object] 가 출력되어야 정상입니다. - 기타 다른 여러(1:1 채팅 또는 실시간쪽지)창 에서도 alert(opener); 혹은 alert(opener.webclient); alert(parent.webclient); 을 실행시켜서 webclient 윈도우 프레임이 정상적으로 지정되었는지를 확인해볼수 있습니다. * webclient.html - simple_config.php 를 정상적으로 설정되었는지를 확인하려면, 웹페이지에서 직접 webclient.html 을 열어 세션/쿠키 인증정보가 정상적으로 출력되는지를 테스트 할수 있습니다. - webclient.html의 applet 파라메타 값을 임으로 지정하여 서버와 제대로 접속이 이루어지는지를 확인할수 있습니다.

5. 심플챗과 사이트 연동 * 1:1 채팅 - 1:1 채팅은 simple_client.requestDate(target_id, target_nm)을 호출 - target_id : 대상 사용자의 id, target_nm : 대상 사용자의 별명(이름) - 1:1 채팅은 simple_date/winOneToOne.asp 파일을 open한다. - 1:1 채팅은 일정시간 동안 응답이 없으면 1:1 신청이 종료되며, 이 시간은 winOneToOne.asp 파일 스크립트 부분에서 timeout 값을 수정하도록 한다. (기본값 20초) ex) opener.simple_client.requestDate('batman', '배트맨'); * 실시간 쪽지 보내기 - 쪽지의 메세지 자체는 일반 웹스크립트를 통해서 전송, 메세지 전송 여부를 서버에 통지한다. - 통지 방법 : simple_client를 통해서 simple_client.message_sended(send_id, send_nm)을 호출 - send_id : 송신자의 id, send_nm : 송신자의 별명(이름) ex) opener.simple_client.message_sended('batman', '배트맨'); => 상대방이 접속하고 있을경우 - 수신자의 webclient.html 의 notify_receive_memo(sender_id, sender_nm) 이 호출됨 sender_id : 쪽지를 보낸 사용자 id, sender_nm : 쪽지를 보낸 사용자 닉네임 - notify_receive_memo() 함수내에 쪽지 수신시 적절한 작업을 하도록 한다 - 쪽지창을 직접 오픈하거나 sound 기능을 통해 사용자에게 통지하도록 한다. sound 기능은 play_sound()를 호출, sound는 플래시 swf파일을 사용한다. => 상대방이 접속하지 않고 있는경우 - 수신자의 webclient.asp 의 memo_not_readed(recv_id, recv_nm) 이 호출됨 recv_id : 쪽지를 받을 사람의 id, recv_nm : 쪽지를 받을 사람의 닉네임 * 얼굴아이콘 추가 - 얼굴아이콘은 대화중에 아이디 앞에 붙는 아이콘이다. - 얼굴아이이콘은 simple_client 의 face_icon 디렉토리에 위치한다. - 얼굴 아이콘은 성별로 단순하게 분리하거나, 여러 아이콘중에 선택하도록 할수 있다. * 대화방 입장 - 대화방은 room_id 를 입력하여 창을 오픈하도록 한다. - 한명이 동시에 여러 채팅방에 입장할수 없도록 설정되어 있다. - 익명 사용자로 로그인 할경우에는 userid, name, age, gender를 직접 get 또는 post로 넘기도록 한다. - channel_id 는 보통 '100' 으로 고정되어 있다. - 보통의 경우 simple_client frame의 joinRoom(channel_id, room_no) 함수를 호출하도록 한다. ex) function openChatWin(channel_id, room_no) { if(webclient != null) webclient.joinRoom(channel_id, room_no); else top.webclient.joinRoom(channel_id, room_no); }

6. 사이트온 설정 - 사이트온 기능은 동적으로 사이트 접속자를 표시해주는 기능이다.(다음카페의 카페온과 유사) - 정상적으로 사이트가 작동한다면, 사이트온의 설정은 별로 어렵지 않다. - 설정 방법 (1) simple_client/script/user_menu.js 를 페이지내에 포함시킨다. (2) 필요 페이지에 div layer를 추가한다.(사용자 popup_menu에 사용됨) - 예제참고 (3) simple_client/siteon/siteon.html 을 해당페이지 iframe 태그로 삽입한다. ex) layer 예제 <div id='siteon_popup' style='position:absolute; left:0px; top:0px; width:0; height:0; z-index:30; visibility: hidden' onMousedown="siteon_menu_off()"></div> ex) iframe 예제 <iframe name="siteon" width="100%" height="150" src="/simple_client/siteon/siteon.html" ALLOWTRANSPARENCY="true" style="background-color:transparent;" scrolling="no" frameborder=0></iframe>