Channel Developers

thumbnail
카테고리

SDK - JavaScript

시작하기

이 문서에서는 JavaScript SDK(이하 "SDK")의 초기 설정에 대해 설명합니다. SDK는 웹 서비스에 채널 버튼을 쉽게 설치할 수 있도록 도와줍니다. 아래 2가지 방법 중 하나를 선택해서 설치해주세요. 옵션1. 직접 로드 일반적인 케이스 웹 서비스가 여러 개의 페이지로 구성되어 있고, 각 페이지를 요청할 때마다 새로운 정적 리소스를 로드한다면 아래의 가이드를 참고합니다. 위와 같은 방식으로 동작하는 웹 서비스를 일반적으로 MPA라고 부릅니다. 자세한 내용은 MPA(Multi-Page Application)를 참고합니다. 1단계: 설치하기 HTML 파일의 <body> 태그 내에 아래 스크립트를 삽입합니다. <script> (function(){var w=window;if(w.ChannelIO){return w.console.error("ChannelIO script included twice.");}var ch=function(){ch.c(arguments);};ch.q=[
시작하기

시작하기(웹뷰)

안드로이드(JavaScript) 안드로이드 환경에서 JavaScript만을 사용해 채널톡 SDK를 사용하기 위해서는 아래와 같은 설정이 필요합니다. JavaScript SDK만 사용하는 경우, 푸시 알림 기능을 지원하지 않습니다. 푸시 알림 기능을 사용하려면 안드로이드(SDK)를 참고합니다. 새 탭 허용하기 안드로이드 웹뷰는 기본적으로 새 탭을 허용하지 않기 때문에, 이를 허용하기 위한 코드를 추가로 작성해야 합니다. webChromeClient = object : WebChromeClient() { override fun onCreateWindow( view: WebView?, isDialog: Boolean, isUserGesture: Boolean, resultMsg: Message? ): Boolean { // intercept new window val transport = resultMsg?.obj as? WebView.WebViewTransport val newWebVi
시작하기(웹뷰)

Content Security Policy

CSP 리스트는 SDK가 제공하는 기능이 변경 됨에 따라 언제든지 수정될 수 있습니다. Content Security Policy(CSP)는 Cross-Site-Scripting (XSS), Clickjacking, Pixel-Perfect timing attacks과 같은 코드 인젝션(Code injection) 공격을 방지하기 위한 웹 보안 기준입니다. 만약 CSP를 지원하고자 한다면, 화이트 리스트에 아래 채널톡의 CSP 리스트를 추가합니다. default-src *.channel.io *.channel.app *.cdninstagram.com connect-src *.channel.io *.channel.app *.sentry.io wss://*.channel.io wss://*.desk-ws.channel.io wss://*.front-ws.channel.io script-src 'unsafe-inline' *.channel.io *.sentry-cdn.com style-s
Content Security Policy

커스터마이징

채널 버튼 커스터마이징 JavaScript SDK가 생성하는 기본 채널 버튼을 사용하는 대신, 직접 만든 HTML 요소를 채널 버튼으로 사용할 수 있습니다. 1. 채널 버튼으로 사용할 HTML 요소를 직접 생성합니다. <!-- 예시 1 --> <button class="custom-button-1">채팅하기</button> <!-- 예시 2 --> <button id="custom-button-2">채팅하기</button> 2. 생성한 HTML 요소에 접근할 수 있는 CSS 선택자를 customLauncherSelector에 전달합니다. 쉼표(,)를 사용해 여러 개의 선택자를 전달할 수도 있습니다. 더 자세한 정보는 CSS 선택자를 참고합니다. 3. 부트 옵션의 hideChannelButtonOnBoot를 true로 설정하여 기본 채널 버튼을 숨깁니다. 아래 예시 코드를 참고합니다. ChannelIO('boot', { "pluginKey": "YOUR_PLUGIN_KEY", "cus
커스터마이징

API Reference

API Reference4개의 아티클
API Reference

브라우저 지원

이 문서에서는 채널톡이 지원하는 웹 브라우저 항목에 대해 설명합니다. 데스크를 위한 웹 브라우저 지원 - Chrome: 최신(latest) 버전 - Safari: 14 이상 버전 - Edge: 최신(latest) 버전 JavaScript SDK를 위한 웹 브라우저 지원 - Chrome: 최신(latest) 버전 - Safari: 16 이상 버전 - Edge: 최신(latest) 버전
브라우저 지원

FAQ

이 문서에서는 JavaScript SDK(이하 "SDK")에 대한 질문을 정리합니다. 회원과 비회원을 구분하고 싶어요 boot할 때 부트 옵션으로 memberId를 전달하는지 여부에 따라 멤버 유저(회원)과 익명 유저(비회원)을 구분합니다. 더 자세한 내용은 부트하기를 참고합니다. 유저의 도움 없이 유저의 프로필 정보를 미리 등록하고 싶어요 부트하기에서 멤버 유저를 위한 부트 실행 코드를 참고합니다. 채널 버튼이 뜨는 위치를 조정하고 싶어요 데스크의 설정 > 일반 설정 > 버튼 설치 및 설정 > 웹 버튼 설정에서 채널 버튼의 위치를 조정할 수 있습니다. 채널 버튼에 사용되는 이미지를 변경하고 싶어요 데스크의 설정 > 일반 설정 > 버튼 설치 및 설정 > 웹 버튼 설정에서 채널 버튼에 사용되는 이미지를 변경할 수 있습니다. 직접 만든 HTML 엘리먼트를 채널 버튼으로 사용하고 싶어요 채널 버튼 커스터마이징을 참고합니다. CSS 선택자로 SDK의 특정 HTML 요소를 선택하고 싶어요 S
FAQ