미니톡 채팅위젯 회원 연동하기
웹페이지에 삽입된 미니톡 채팅위젯에 기존 홈페이지의 사용하던 회원시스템과 연동하는 방법에 대해 설명합니다.
이 매뉴얼 문서에서는 미니톡 클라이언트의 개발언어와 동일한 PHP 예제로 설명을 하지만, Node.js, ASP, JSP, PYTHON 등 기존 사용하시던 언어에 맞게 암호화관련 함수를 수정하여 연동하실 수 있습니다.
유저코드에 사용하는 암호화 방식은 ZERO_PADDING 을 이용한 AES-256-CBC 암호화 방식을 사용합니다.
미니톡 클라이언트가 설치된 환경에서 /classes/widget.php 파일 이용하기
미니톡 클라이언트가 설치되어 있는 서버와 동일한 환경에서 미니톡 채팅위젯을 사용할 경우, 미니톡 클라이언트 폴더의 /classes/widget.php 파일을 INCLUDE 하여 손쉽게 연동이 가능합니다.
<?php REQUIRE_ONCE './classes/widget.php'; // 해당 파일의 위치에 맞게 경로는 알맞게 수정하여 줍니다. $nickname = $mb['mb_name'] ? $mb['mb_name'] : ''; // 회원이름이 담긴 변수 $nickcon = ''; // 회원 닉이미지 전체경로 $photo = ''; // 회원 사진 전체경로 $level = 1; // 레벨은 1~9까지 정의할 수 있으며 9 레벨이 관리자권한을 의미합니다. // 유저의 추가정보가 있다면 배열형식으로 담을 수 있습니다. $extras = array( 'key'=>'value' ); ?> <script type="text/javascript" src="[미니톡 클라이언트가 설치된 경로]/scripts/minitalk.js"></script> <script type="text/javascript"> new Minitalk({ id:"MinitalkPreview", // 페이지내 유니크한 랜덤한 값을 입력합니다. channel:"example", // 미니톡 클라이언트 관리자에서 생성한 채널명 width:"100%", height:"100%", templet:"default", usercode:"<?php echo MinitalkUserCode($nickname,$level,$nickcon,$photo,$extras); ?>" }); </script>
$nickname 변수는 닉네임은 일부 특수문자(#, @) 밑 따옴표(", ') 그리고 공백을 제외한 30자 이내의 문자로 설정하셔야 합니다.
$nickcon 변수에는 닉이미지로 사용할 이미지의 전체주소 (https://www.yourdomain.com/member/nickname.gif 등) 로 설정하거나, 회원아이콘 및 회원닉네임을 모두 표현하고자 할 때에는 URL 주소 및 {NICKNAME} 치환자를 이용하여, 지정할 수 있습니다.
$nickcon = 'https://www.yourdomain.com/member/icon.gif,{NICKNAME}';
이렇게 설정할 경우 {NICKNAME}부분이 접속자 닉네임으로 치환되고, 접속자 닉네임 앞에 icon.gif 이미지가 추가되어 나오게 됩니다.
PHP 를 이용하여 유저코드 생성하기
PHP 5.3버전 이상에 기본적으로 포함된 openssl_encrypt 확장모듈을 사용하여 유저코드를 생성하는 방법은 아래와 같습니다.
<?php /** * 복호화가 가능한 방식(AES-256-CBC)으로 문자열을 암호화한다. * * @param string $str 암호화할 문자열 * @param string $key 미니톡 클라이언트를 설치할 때 입력한 암호화키 * @return string $ciphertext */ function MinitalkEncoder($str,$key) { $key = md5($key); $padSize = 16 - (strlen($str) % 16); $str = $str.str_repeat(chr($padSize),$padSize); $output = openssl_encrypt($str,'AES-256-CBC',$key,OPENSSL_RAW_DATA | OPENSSL_ZERO_PADDING,str_repeat(chr(0),16)); return base64_encode($output); } /** * 클라이언트 아이피를 가져온다. * Proxy 서버를 통해 접속하였을 경우에도 가급적 실제 아이피를 가져온다. * * @return string $ip */ function GetClientIp() { return isset($_SERVER['HTTP_X_FORWARDED_FOR']) == true ? $_SERVER['HTTP_X_FORWARDED_FOR'] : $_SERVER['REMOTE_ADDR']; } /** * 유저코드를 가져온다. * * @param string $nickname 닉네임(필수) * @param int $level 권한레벨 (1~9, 9 : 최고관리자 / 기본값 : 1) * @param string $nickcon 닉이미지 (옵션) * @param string $photo 프로필사진 (옵션) * @param any[] $extras 유저 추가정보 (옵션, key-value 배열만 가능) * @return string $userCode 유저코드 */ function MinitalkUserCode($nickname,$level=1,$nickcon=null,$photo=null,$extras=array()) { $user = array( 'nickname'=>$nickname, 'level'=>intval($level), 'nickcon'=>$nickcon ? $nickcon : null, 'photo'=>$photo ? $photo : null, 'extras'=>count($extras) > 0 ? $extras : null, 'ip'=>GetClientIp() ); return MinitalkEncoder(json_encode($user,JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES),'미니톡 클라이언트를 설치할 때 입력한 암호화키'); } ?>
Node.js 를 이용하여 유저코드 생성하기
Node.js 에 기본적으로 포함되어 있는 crypto 모듈을 이용하여 유저코드를 생성합니다.
var crypto = require("crypto"); /** * 복호화가 가능한 방식(AES-256-CBC)으로 문자열을 암호화한다. * * @param string str 암호화할 문자열 * @param string key 미니톡 클라이언트를 설치할 때 입력한 암호화키 * @return string ciphertext */ function MinitalkEncoder(str,key) { var key = crypto.createHash("md5").update(key).digest("hex"); var iv = Buffer.alloc(16,"\0"); var str = Buffer.alloc(Buffer.byteLength(str,"utf8"),str,"utf8"); var padSize = 16 - (str.length % 16); for (var i=0;i<padSize;i++) str+= String.fromCharCode(padSize); var cipher = crypto.createCipheriv("aes-256-cbc",key,iv); cipher.setAutoPadding(false); var output = cipher.update(str,"utf8","base64") + cipher.final("base64"); return output; } /** * 클라이언트 아이피를 가져온다. * 사용하는 모듈에 따라 접속자의 아이피를 가져오는 방법이 다르므로, * 클라이언트 아이피를 반환할 수 있는 함수를 만들어 줍니다. * * @return string ip */ function GetClientIp() { return "127.0.0.1"; } /** * 유저코드를 가져온다. * * @param string nickname 닉네임(필수) * @param int level 권한레벨 (1~9, 9 : 최고관리자 / 기본값 : 1) * @param string nickcon 닉이미지 (옵션) * @param string photo 프로필사진 (옵션) * @param any[] extras 유저 추가정보 (옵션, key-value 배열만 가능) * @return string userCode 유저코드 */ function MinitalkUserCode(nickname,level,nickcon,photo,extras) { var user = { nickname:nickname, level:typeof level == "number" ? level : 1, nickcon:nickcon ? nickcon : null, photo:photo ? photo : null, extras:typeof extras == "object" ? extras : null, ip:GetClientIp() }; return MinitalkEncoder(JSON.stringify(user),"미니톡 클라이언트를 설치할 때 입력한 암호화키"); }