웹 푸시 알림은 사용자가 사이트에 없을 때에도 도달합니다
- 유효한 SSL 인증서가 있는 보안 HTTPS 웹사이트
- 웹사이트에 OneSignal 서비스 워커를 추가할 수 있는 능력
- 동일 출처 정책을 따르는 단일 출처
- 알림 수신에 대한 사용자 권한
- 지원되는 브라우저(Chrome, Firefox, Safari, Edge)
설정 가이드 선택
다음 사이트 설정 경로 중 하나를 완료하세요.개발자가 아니신가요? 팀 구성원 관리를 참조하여 OneSignal 프로젝트에 대한 개발자 액세스 권한이 있는 팀원을 초대하세요.
웹 SDK 설정
일반 사이트: 대시보드를 구성하고, 서비스 워커를 업로드하고, JavaScript SDK를 추가하세요.
WordPress 플러그인
공식 OneSignal 플러그인입니다. JavaScript SDK나 서비스 워커 업로드가 필요하지 않습니다.
Shopify 설정
Vendo 통합을 통해 Shopify를 연결하세요. Vendo가 스토어프론트에 SDK를 배포합니다.
다른 공급자에서 마이그레이션
다른 웹 푸시 공급자에서 전환하고 구독을 유지하세요.
manifest.json을 추가하고 사용자가 사이트를 홈 화면에 추가하도록 하세요.
iOS 웹 푸시 설정
사이트 설정 경로를 완료한 후 필요한 Apple 추가 요구 사항입니다.
통합 유형
OneSignal 대시보드에서 Settings > Push & In-App > Web으로 이동하여 사이트와 일치하는 통합 유형을 선택하세요.
웹사이트 설정에 따라 통합 유형 선택
일반 사이트
권장. 대시보드에서 프롬프트, 환영 알림, 서비스 워커 경로를 구성하세요.
WordPress
공식 OneSignal WordPress 플러그인을 사용하는 경우 필수입니다.
사용자 지정 코드
코드에서 프롬프트와
init 옵션을 완전히 제어하세요.웹 권한 프롬프트
사용자는 웹 푸시를 받기 전에 권한을 부여해야 합니다. 브라우저는 해당 권한 부여를 위한 기본 시스템 대화 상자를 표시합니다. OneSignal은 가치를 설명하고 브라우저가 반복되는 기본 프롬프트를 차단하지 않도록 사용자 지정 가능한 사전 프롬프트를 먼저 사용할 것을 권장합니다. 일반 사이트 및 WordPress: 언제든지 OneSignal 대시보드에서 프롬프트를 추가, 제거, 업데이트하세요. 사용자 지정 코드:OneSignal.init()에서 프롬프트를 제어하세요. 웹 SDK 참조를 참조하세요.
웹 권한 프롬프트
슬라이드다운, 카테고리, 기본, 구독 벨 및 기타 프롬프트 유형을 비교하세요.
웹 SDK 참조
웹 SDK를 사용하여 코드에서 프롬프트를 표시하거나 숨기세요.
iOS는 사용자가 사이트를 홈 화면에 추가할 때까지 권한 프롬프트를 표시하지 않습니다. iOS 웹 푸시를 참조하세요.
사용자 및 구독
사용자가 푸시에 구독하면 OneSignal은 해당 브라우저와 기기에 연결된 구독을 생성합니다. 웹 푸시 구독은 사용자가 다음과 같은 경우 생성됩니다:- 특정 브라우저와 기기에서 웹사이트의 푸시 알림 권한을 부여하는 경우
- 브라우저 데이터를 지운 후 사이트로 돌아오는 경우(자동 재구독이 활성화된 경우)
- 새 브라우저 또는 기기에서 구독하는 경우
각 브라우저와 기기 조합은 별도의 구독을 생성합니다. 시크릿 및 프라이빗 브라우징에서는 구독을 생성할 수 없습니다. 웹 푸시 구독은 External ID를 할당할 때까지 익명으로 유지됩니다.
OneSignal 대시보드: Audience > Users
사용자
사용자를 관리하고, External ID를 할당하고, 활동을 추적하세요.
구독
브라우저 및 기기 전반에 걸쳐 구독이 작동하는 방식입니다.
세그먼트
사용자를 세그먼트로 그룹화하여 행동, 기기 등을 기반으로 타겟팅하세요.
웹 푸시 알림 디자인
웹 푸시 알림은 제목, 메시지, 아이콘, 이미지, 작업 버튼을 지원합니다. 다이어그램은 사용자 지정할 수 있는 요소(1–5)와 브라우저가 제어하는 요소(6–9)를 보여줍니다.
웹 푸시 알림 구조. 요소 1–5는 사용자 지정할 수 있습니다. 6–9는 브라우저가 제어합니다.
- 제목: 주의를 끄는 헤드라인(권장: 50자 미만)
- 메시지: 주요 알림 콘텐츠(권장: 120자 미만)
- 아이콘: 정사각형 브랜드 아이콘(권장:
256×256PNG, JPG 또는 애니메이션이 아닌 GIF) - 대형 이미지: 눈길을 끄는 시각적 콘텐츠
- 작업 버튼: 행동 유도 버튼
- 브라우저: 푸시를 표시하는 브라우저
- 도메인: 브라우저가 설정하는 사이트 출처
- 타임스탬프 및 닫기: 브라우저가 추가하는 컨트롤
- 추가 옵션: 브라우저별 추가 컨트롤
푸시 개요
푸시 알림 생성, 옵션 및 전달 동작에 대한 전체 개요입니다.
템플릿
일관된 메시징을 위해 재사용 가능한 템플릿으로 시간을 절약하세요.
개인화 및 현지화
각 사용자의 선호도와 언어에 맞게 푸시 메시지를 사용자 지정하세요.메시지 개인화
이름이나 선호도 같은 동적 변수를 삽입하여 메시지를 맞춤화하세요.
다국어 메시징
각 사용자의 선호 언어로 메시지를 전달하세요.
웹 푸시 동작 구성
메시지가 언제 나타나는지, 얼마나 오래 저장되는지, 클릭 시 어떤 일이 발생하는지 제어하세요.전달, 표시 및 해제 설정
조절
알림 전달 속도를 제어하세요.
빈도 제한
동일한 사용자에게 알림을 과도하게 보내는 것을 방지하기 위해 제한을 설정하세요.
수명(TTL)
기기가 오프라인일 때 푸시 서비스가 메시지를 유지하는 기간을 정의하세요.
웹 푸시 주제
주제를 사용하여 중복 알림을 그룹화, 교체 또는 억제하세요.
클릭 동작
실행 URL과 클릭 시 열린 탭에 포커스하거나 이동하는 방식을 선택하세요.
설정 테스트
전체 대상에게 보내기 전에 브라우저 전반에 걸쳐 통합을 확인하세요.출시 전 체크리스트
- SDK가 콘솔 오류 없이 로드됨
- 권한 프롬프트가 나타나고 올바르게 작동함
- 테스트 알림이 전송되고 수신됨
- 아이콘과 이미지가 올바르게 렌더링됨
- 서비스 워커가 등록되고 최신 상태임
- HTTPS 인증서가 유효함
분석 및 문제 해결
푸시 메시지 보고서
각 메시지의 전달, 오픈율 및 클릭률 지표를 확인하세요.
분석 개요
채널 전반에 걸쳐 참여 및 사용자 행동 지표를 탐색하세요.
알림이 표시되지 않거나 지연됨
메시지가 나타나지 않는 경우 문제 해결 체크리스트입니다.
알림 이미지가 표시되지 않음
다양한 브라우저에서 이미지 렌더링 문제를 해결하세요.
다음 단계
A/B 테스트
실험으로 메시지를 최적화하여 참여를 유도하는 요소를 찾으세요.
여정
사용자 행동으로 트리거되는 자동화된 다단계 메시징 흐름을 구축하세요.
태그
개인화 및 세그먼트를 위해 사용자에게 사용자 지정 속성을 추가하세요.
자주 묻는 질문
iOS에서 사용자가 웹 푸시를 구독할 수 있나요?
네, iOS 16.4+부터 가능합니다. 먼저 일반 사이트, 사용자 지정 코드, WordPress 또는 Shopify 설정을 완료한 다음manifest.json을 추가하고 사용자가 사이트를 홈 화면에 추가하도록 하세요. iOS 웹 푸시 설정을 참조하세요.
사용자가 웹 푸시 알림 수신을 중단한 이유는 무엇인가요?
가장 일반적인 이유는 다음과 같습니다:- 사용자가 브라우저 데이터를 지운 경우. 웹 푸시 설정에서 자동 재구독 옵션을 활성화했다면 사용자가 사이트로 돌아올 때 자동으로 조용히 재구독됩니다.
- 사용자가 운영 체제 설정에서 푸시 알림을 껐을 경우. 푸시 알림을 다시 받으려면 사이트를 수동으로 재구독해야 합니다.
웹 푸시 알림은 시크릿 또는 프라이빗 브라우징 모드에서 작동하나요?
아니요. 사용자는 시크릿 또는 프라이빗 브라우징 모드에서 웹 푸시를 구독할 수 없습니다. 일반 세션에서 생성된 구독은 프라이빗 모드에서 접근할 수 없습니다.어떤 브라우저가 웹 푸시 알림을 지원하나요?
Chrome, Firefox, Safari(macOS 및 iOS 16.4+), Edge 모두 웹 푸시를 지원합니다. 각 브라우저마다 프롬프트 동작과 알림 표시가 다를 수 있습니다. 브라우저별 세부 정보는 웹 푸시 FAQ를 참조하세요.웹 푸시에 서브도메인을 사용할 수 있나요?
각 서브도메인(예:app.example.com 대 shop.example.com)은 별도의 출처입니다. 브라우저는 웹 푸시에 동일 출처 정책을 적용하므로 각 서브도메인에는 고유한 OneSignal 앱이 필요합니다. 서비스 워커도 구독 페이지와 동일한 출처에 호스팅되어야 합니다. CDN 및 기타 서브도메인은 허용되지 않습니다. 다중 사이트 및 서브도메인을 참조하세요.