블루톡 예제 · 샘플 모음 > BlueTalk::블루톡 무료 실시간 채팅 위젯 · 1:1 DM

예제

BlueTalk 예제 · 샘플 모음

이 페이지는 BlueTalk(블루톡)의 모든 예제/샘플 페이지를 한 곳에서 정리한 인덱스입니다.
예제들은 모두 현재 JS 구조(new BlueTalk() + window.SITE_KEY / GLOBAL_*)와 현재 서버 API(/upload/chat-file, /chat-file/:id, /health)를 기준으로 작성되어 있습니다.

1. 기본 위젯 / 레이아웃 예제

파일	설명
/ex/widget_basic.php	기본 위젯 설치 예제 (HTML/JS) – 가장 단순한 형태의 블루톡 위젯 예제. – `<div id="bluetalk">` + `new BlueTalk()` 패턴 확인용.
/ex/layout_float.php	오른쪽 하단 플로팅 채팅 레이아웃 – 💬 버튼 + 플로팅 패널 형태로 블루톡을 띄우는 예제. – 토글/닫기/헤더 포함 기본 플로팅 UI 구조 제공.
/ex/dm_basic.php	1:1 DM 기본 예제 – `mode: 'dm'`을 사용한 DM 전용 페이지/위젯 예제. – `dm_key`로 세션을 식별하는 개념 정리.
/ex/upload_example.php	이미지 · 파일 업로드 예제 – `POST /upload/chat-file` 호출 예제 + 응답 구조 설명. – REST 업로드 테스트 + BlueTalk 채팅 UI를 한 화면에서 확인하는 샘플.

2. 그누보드 · 아미나 연동 예제

파일	설명
/ex/gnuboard_basic.php	그누보드 · 아미나 기본 연동 – `head.sub.php`에 site_key / user_key를 넣고 글로벌 채팅을 붙이는 예제. – 메인/특정 게시판 등 조건부 출력 패턴 포함.
/ex/gnuboard_channel.php	게시판별 채널 연동 예제 – `$bo_table`을 이용해 `board_게시판ID` 형태로 채널을 나누는 예제. – `GLOBAL_CHANNEL`을 문자열/배열로 설정하는 방법 설명.

3. 서버 사이드 API 샘플 (Node / PHP / Python)

파일	설명
/ex/api_samples_node.php	Node.js 연동 예제 모음 – `axios + form-data`를 이용한 `/upload/chat-file` 호출 예제. – `socket.io-client`로 WebSocket 봇/공지 메시지 구현 개념.
/ex/api_samples_php.php	PHP 연동 예제 모음 – cURL로 파일 업로드, HTML 폼 + PHP 업로드 테스트 페이지. – PHP에서 user_key 생성 후 JS SDK와 연결하는 기본 패턴.
/ex/api_samples_python.php	Python 연동 예제 모음 – `requests`로 파일 업로드 / health check 호출. – FastAPI + Jinja2에서 user_key 생성 후 JS SDK와 연동하는 패턴.

4. 문서 / 개발 가이드 바로가기

예제를 보기 전에, 또는 예제와 함께 읽으면 좋은 개발 가이드 문서들입니다.

/page/bluetalk_quickstart.php	블루톡 빠른 시작 (1분 설치) – 전체 흐름을 가장 빠르게 훑어볼 수 있는 스타트 가이드.
/page/bluetalk_gnuboard.php	그누보드 · 아미나 연동 가이드 – 회원 시스템 연동, head.sub.php 패턴, 게시판별 채널 설계 등.
/dev/api_auth.php	인증 구조 / site_key · user_key 설계 – `site_key / user_id / nickname / user_key` 네 가지 값 설계 가이드.
/dev/api_overview.php	API 개요 (REST + WebSocket) – /upload/chat-file, /chat-file/:id, /health, WebSocket 이벤트 개요.
/dev/api_errors.php	에러 코드 · 응답 포맷 – `{ ok, error:{ code, message } }`, `{ ok, reason }` 패턴 및 대표 코드 설명.