KCP 창업 지원, 수수료 국내최저 2.9% 제공 이벤트!

[펄스나인] 실시간 대화(채팅) 쪽지 (2020.09.14) > 그누보드5 스킨

그누보드5
영카트5
스터디
Q & A
제작의뢰
컨텐츠몰
부가서비스
소모임
커뮤니티
부가서비스
KCP 이벤트!

그누보드5 스킨

스킨 다운로드시 좋아요 클릭과 감사의 코멘트를 남기시면 제작자에게 큰 힘이됩니다. ^^y

[펄스나인] 실시간 대화(채팅) 쪽지 (2020.09.14) 정보

회원통합스킨 [펄스나인] 실시간 대화(채팅) 쪽지 (2020.09.14)

첨부파일

첨부파일 대화형쪽지_20200914.zip (18.2K) 168회 다운로드 2020-09-14 01:48:18 포인트 차감10
테스트한 버전5.4.2.8
호환 가능 버전5.4.X.X

본문

2020.09.14 기능추가 및 수정

실시간 수신확인 기능 추가 (대화내용 가져올때 자동실행 / 기본 10초)
/bbs/ajax.memo_read.php 파일추가

memo_form.skin.php 407라인~433라인 check_Read() 함수추가

 

237736610_1600015009.4615.png

대화목록 실시간 새로고침 되도록 처리

memo.skin.php 208라인에 setinterval 주석처리 되어 있습니다.
필요하신분은 주석해제 하시면 됩니다.

이전 대화보기 클릭시 10개씩 보이도록 수정
대화방에서 프로필 사진 클릭시 자기소개(팝업)로 연결 추가
반복단어 입력시 풍선 깨지는 문제 수정


코어파일의 수정을 지양하고 있는관계로 기타 요청하신 편의사항은 작업하지 않았습니다.
스킨의 특성상 별도 코어파일의 수정없이 업로드만으로 사용을 할 수 있어야 된다는 생각 입니다.
양해 부탁드립니다 ^^

 

2020.08.27 수정 memo.skin.php 58라인

대화목록에서 프로필이미지 안나오던 문제 수정
$p_icon = get_member_profile_img($mb['mb_id']);

 

2020.08.26 기능추가 및 수정 style.memo.css, memo_form.skin.php, memo.skin.php

닉네임 자동검색(10레벨 회원은 검색제외) 추가, 불필요한 클래스 제거.
memo_search.js 파일 추가

 

2020.08.24 수정 style.memo.css

마지막라인 추가 (닉네임 및 메세지 입력 포커스시 라인 생기는 부분 제거)
@우성짱 님 도움주셔서 감사합니다.

 

Ajax를 활용한 실시간 대화형(채팅) 쪽지 스킨 입니다.
우선 배포를 허가해주신 @메이드 님께 감사의 말씀 올립니다.

원본링크 : https://sir.kr/g5_skin/33036

 

혼자 쓰려고 깨작깨작 만들다가

더 좋은 코드가 나오기를 기대하고 업로드 합니다!

 

이걸로 카톡같은 채팅서비스는

꿈꾸지 않으시는것이 바람직합니다. :D

 

 

설치방법
01. /bbs/ 폴더에 ajax.memo.php, ajax.memo_del.php, ajax.memo_read.php 파일 업로드.

02. /skin/member/basic/ 폴더에 나머지파일 업로드

테마 및 모바일버전 별도사용시 해당 폴더 내 02. 동일폴더로 업로드 하시면 됩니다.

스킨폴더 내 원본파일은 반드시 백업을 권장합니다.

 

기능요약

메세지는 10초 마다 자동 갱신. (setInterval, 10000)

갱신 주기는 memo_form.skin.php 파일 마지막 라인의

숫자를 변경하시면 됩니다. setInterval( function() {} 을 삭제하시면 갱신하지 않으며

새로고침 버튼을 넣어두었으니 활용하시면 되겠습니다.

과부하 테스트는 안해봤습니다.

사용자가 많은 사이트는 setInterval( function() {} 을 지우는것을 추천 드립니다.

 

메세지 목록 -------------------

읽지 않은 메세지가 있는 경우 표기

마지막 대화 및 마지막 대화시간 표기

최근 대화를 위로 정렬

닉네임 입력으로 대화상대 추가

메세지가 없는 경우(모두 삭제된 경우) 목록에서도 삭제

닉네임 자동검색 // 2020.08.26 추가

 

메세지 전송/보기 -------------------

보낸 메세지 삭제

메세지가 10개가 넘으면 [이전대화 10개씩 보기] 버튼 활성화

태그를 입력하는 경우 보안상 줄바꿈 외 제거

Shift+Enter 키 입력으로 줄바꿈 가능

신규 대화시 오늘날짜 표기 및 지난대화에서 날짜를 표기 (카톡과 비슷..)

메세지는 10초 마다 자동 갱신 (위 설명 있음)
수신확인 // 2020.09.14 추가 (10초마다 자동 갱신)

 

기타 -------------------

그누 5.4 쪽지알림 카운트 추가

(안읽음 카운트, 안읽었으나 상대방이 삭제했을때 카운트 제거)

크로스브라우징 : 익스11, 엣지, 크롬, 웨일

 

기존 방식과는 다르게 메세지 1개씩 DB로 저장합니다.

모든 스타일은 style.memo.css 에서 수정가능 합니다.

 

혼자서 테스트를 한다고는 했는데 충분한 테스트가 못되었을 수 있으니

충분한 테스트를 거치고 실서비스에 적용 하시는것을 권장 합니다..

피드백은 환영입니다만.. 어려운건 수정이 안될 수 있습니다. ㅎㅎ

 

다시 타오르는 코로나 조심들하세요.

감사합니다.

 

237736610_1598440719.3828.png

 

237736610_1598208449.3025.png

 

237736610_1598208433.9437.png

 

 

추천을 실천해보세요. :D

추천36

댓글 전체

Fatal error: Uncaught Error: Call to undefined function get_memo_not_read() in /host/home/dohyeon2713/html/theme/ap/mobile/skin/member/basic/memo_form.skin.php:12 Stack trace: #0 /host/home/do62713/html/bbs/memo_form.php(39): include_once() #1 {main} thrown in 

/host/home/do62713/html/theme/ap/mobile/skin/member/basic/memo_form.skin.php on line 12

이런 오류가 뜨네요..ㅠ  흐귝..
혹시 원인 알려주실 수 있나욤...ㅠ
아 5.3 이라 get_memo_not_read 함수가 없어서 그런거같네요..ㅠ.ㅠ
get_memo_not_read 함수를 추가하거나 해당부분을 다 삭제해야 가능할거같습니다..

5.4에서 테스트를 하다보니
해당 함수가 5.3에는 없는걸 이제알았네요 죄송합니다 흨
5.3.3.3버전에서 get_memo_read() 함수를 넣으면 제대로 보이기는 합니다. ( 기존 쪽지보다 반응이 느립니다. ) 쪽지 삭제, 쪽지 보기까지는 되는데, 쪽지 발송은 되지 않네요.
오 ㅎㅎ 테스트 감사합니다 ^^
메세지입력에 포커스갈때 라인생기는건 처리를 해야겠네요
css안에 안넣었나 봅니다 ㅋ

<style>
#chat-message:focus {outline:none !important; border:0px !important;}
</style>


이모지는 몰랐는데
잘되네요 ㅎ

css 마지막라인에 아래것도 추가해주세요 ㅎ
닉네임입력쪽도 빠졌네요 ㅎ

input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus { outline:none !important; border:0px !important; }
/skin/member/basic/style.memo.css?ver=191202

혹시 뒤에 ?ver= 붙는건 어떻게 수정하면 될까요?

/extend/version.extend.php

이거군요 ㅎㅎ 감사합니다.
대화 추가하기 닉네임 입력 가독성이 조금 떨어지는 것 같아요!

노란색은 괜찮은데, 글자가 흰색이라 처음에는 못찾았어요 ㅎㅎ
대화 추가하기(닉네임입력) 부분에 글자를 넣으면 SIR의 @ 눌러서 닉네임 나와서 선택하는 것도 좋을 것 같아요.

그건 너무 어렵겠죠 ㅠㅠ
더 좋은건 글자 쳤을때 자동 정렬이 되면 더 좋을 것 같습니다.

예를들어 ㅍ 을 넣었을 때 펄스나인이 나온다던가.. 하는 ..
테스트 사이트 추가해봅니다.

그누보드 5.4.2.8 :  https://glad.ml

그누보드 5.4.2.8 + 나리야빌더 : https://n.glad.ml

둘다

test01 / test01

test02 / test02

넣어뒀습니다.

나리야에서는 badge css가 충돌하더라구요.

badge를 badge로 바꾸니 잘 됩니다.

물론 메모폼에서도 수정해줘야겠죠?

아 그리고 badge-primary도 지워주는게 좋습니다.

뒤에 파란 배경이 생기더라구요.
넵 ㅎ 그누 순정에서는 잘 됩니다.

badge-primary badge-pill m-auto tit_ti

그런데 위 속성은 그누 순정에도 없고 올려주신 파일의 css에도 없더라구요.

아마 부트스트랩 속성인거 같은데, 그게 나리야에서는 같은 속성으로 쓰이기 때문에 충돌이 있는 것 같습니다.

그누 순정에서만 쓴다면 없어도 될 것 같아요!
초성 검색은 좀 무리가 있어서
일단 일반검색으로 업데이트 되었습니다.

불필요한 클래스도 제거 되었습니다~

1. 메시지를 입력할때, 받을때 효과음 넣기.
2. 쪽지가 오면 핸드폰에서 카톡하게 울리기

등등의 기능이 있으면 더 좋을꺼 같아요.
응원합니다.
카톡연동은 작업은 가능하나,
카카오 비즈니스 가입이나 기타 부가적인 해야될게 많아서
가이드를 하기가 어렵습니다 ㅎㅎ

효과음 부분은 고려해보겠습니다 ^^
매일 업데이트 하시네요.
방법하나뿌리고갈께요 .
본인 과대화할수없기에 의미없는것으로 보입니다. 본인과의 대화를 막으려고한다면 아래처럼 하세요.
스킨에서
memo_form.skin.php
해당파일 상단
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
이소스 바로밑에 적으면됩니다.

if($member['mb_id'] == $me_recv_mb_id){
alert_close("본인과 대화 할수없습니다.",true);
}
와 능력자분이 드디어..!
아래 부분이 아직 안되었습니다..ㅎ

실시간 수신확인
기본 수신확인 코드는 들어 있고.. (카톡과 비슷하게..ㅎ)
주석 해제하면 바로 쓸 수 있으나 새로고침을 해야만 수신확인 카운트가 사라지기 때문에
이걸 인터벌 돌릴때 반영시키고 싶습니다. ^^

또 가능하다면 대화 목록쪽도
대화방 안에처럼 Ajax로 새로고침 되면 좋을거같구요 ㅎㅎ
https://sir.kr/qa/374212?sfl=mb_id%2C1&lstx=woolaf

인터벌이 1초로 하면 안된다고 하더군요.
3초는 어떨지 모르겠지만..
저는 아예 리액트로 그냥 카카오톡을 다시 만들려고 합니다.
그러면 푸쉬알림까지 해결이 된다고 해서요.

이걸 php로 끝낼 수가 있는건지.. 의문이네요.
그렇죠 매초당 세팅으로 채팅용도로는 절대 부적합합니다 ㅎ
질문 하신대로 동접자 100명 수준이 동시에 쓴다고 가정하면 답안나옵니다..ㅎㅎ
5~10초로 놓고 불러오는 용도로만 쓰셔야합니다.
대화가 엄청 많을 때

이전 대화 불러오기하면 부하가 크지 않을까요?

버튼을 누를 때 이전 20개나 30개 불러오면 좀 나을 것 같기도 합니다.
잘 설치해서 쓰고 있습니다. 감사합니다. 펄스나인님 혹시 전체회원에게 쪽지 보내는 기능도 구현 가능할까요 ㅋㅋ 아 귀찮게 5명 6명 모두 일일이 아이디 찾아 입력해야되고 이게 보통 귀찮은게 아니더군요 ㅎㅎ 이럴바에는 차라리 전체 쪽지 돌리는게 나을듯 싶기도 해서요
전체회원 쪽지발송은 어차피 관리자만 해당되는거니
관리자모드에서 전체회원에게 보내는걸 추천드리고싶네요~
https://sir.kr/g5_plugin/5845
플러그인이 있네요 참고해보세요 ㅎㅎ
좋은 스킨 감사합니다!! ajax.memo.php 91번째줄과 memo_from.php 21번째 줄 관리자가 아니면 조건문이 에러나서 관리자 여도 정보공개를 하지 않으면 채팅이 불가능하게 되어있네용 저는 회원들도 정보공개 안해도 쪽지는 가능하게 할 생각이어서 주석처리 하니 잘됩니다
너무 훌륭하네요 이런 소스 너무너무 감사합니다

이거 영카트용으로도 사용하게 닉네임 클릭시 정보라던가 이런거 볼 수 있게도 할 수 있나요?
좋은말씀 감사합니다.
채팅방에서 프로필사진 클릭시 그누기본으로 있는
자기소개로 연결 정도는 가능할거같네요.

이번주 목록부분 새로고침, 수신확인, 이전대화보기 10개씩
업데이트 예정인데 같이 처리해보겠습니다.
음 다른회원하고 대화를 하는용도여서
주문내역은 다른 회원이 볼 수 없으니 좀 애매한것 같습니다 ㅎ
개인적으로 쓰실거면 프로필 이미지쪽에 $is_admin 조건으로 링크만 추가해주시면 될것 같습니다~
일단은

<a href="/adm/shop_admin/orderlist.php?sel_field=mb_id&search=<?php echo $recv_mb['mb_id'] ?>" target="_blank">회원 주문내역 보기</a>

이렇게 쓰고 있는데 더 좋은 방법은 없겠죠?
음 영카트에서 상담용으로 사용을 하시는거면
채팅방안에 하단이나 상단에 별도 영역을 만들어서
관리자의 경우 간단한 개인정보를 보여주고 클릭하면 연결될 수 있도록 하는게 좋을거같네요 ^^
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa같은 단어나 url입력시 버블이 깨져서
#chat-list  .bubble_recv
#chat-list  .bubble_send


word-break:break-all;

추가해줬습니다.
펄스나인님 이거 여기 플러그인에 올라온 thisgun님 알람에 연동시키려 하는데 memo_update에 있는 hook를 가져다 insert쪽에 수정해서 넣었는데.. Json이라서 그런지 안되는데 혹 방법이 없을까요ㅜㅜ 일단은 저도 더 고민해서 방법을 찾으면 댓을 달도록 하겠습니다..
이게 맞는방법인지는 모르겠지만, 스킨쪽 success에서 다시한번 ajax를 만들어 보내서 hook이 전달되도록 해결했습니다.. 그누 공식프로그램은 아니라서 저한테만 필요한 기능 같기도 합니다

그리고 에러문구 관련해서는 css잡혀 있는게 없는것 같습니다. ex)포인트가 모잘라 쪽지가 안갈때??같은부분이 디자인이 깨져서 나오는것 같습니다
안녕하세요, 감사히 다운 받아 쓰고 있습니다. 제목 '누구'님과 대화하기 에 무조건 텍스트 닉네임이 아니라 지금 현재 적용된 닉네임을 사용하려면 어떻게 해야할까요? 만약 현재 아이콘으로 적용되어있다면 그대로 보일 수 있도록 하고 싶어요~
이미지 첨부는 필요할것 같아서 잠깐 보긴했는데 좀 어렵더라구요. ㅎ
계획은 없지만.. 시도해보려고 보고있는 중입니다 !
아이고 고생이 많으십니다

스킨 같은거에 보면 에디터 가능한 쪽지 이런게 있더라구요

여기서 첨부쪽만 따와서 만들면 조금 수월할까요?
음 에디터는 입력자체를 input에서
에디터로 변경을 해야되서 구조상 좀 안맞을것 같고
에디터의 사진부분만 따오면 좋겠는데
그건 조금 난이도가 높을것 같습니다 ㅠ

버튼클릭으로 파일을 첨부하는것과
이미지를 드래그앤드롭 으로 넣으면 좋을거같네요~
아직 공개된 스킨에는 파일첨부는 없는거같아서
별도로 보고 있습니다 ^^

#chat-header .badge3 {padding:0.2rem; font-size:14px; font-weight:bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;color:#fff; line-height: 60px; font-weight: bold;}


font-weight가 2개인 것 같습니다. ㅎㅎ
음 저만 그런지 모르겠지만 사용자가 관리자를 검색하면 리스트에 안나오네요.

닉네임을 입력하고 +를 누르면 채팅창은 잘 뜨고 채팅도 잘 됩니다.

관리자도 리스트에 뜨면 좋을 것 같아요!
관리자는 일부러 검색 안되게 해놨습니다 ㅎ
memo.skin.php 156라인쯤에

if($row['mb_level'] < 10) {
    echo json_encode($row['mb_nick']).",";
}

if문으로 감싼 부분을 아래와같이 제거하시면 되겠습니다.

//if($row['mb_level'] < 10) {
    echo json_encode($row['mb_nick']).",";
//}
전체 1,863 |RSS
그누보드5 스킨 내용 검색

회원로그인

(주)에스아이알소프트 (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT