# Web Push 연동

## 사전 작업 <a href="#pre-work" id="pre-work"></a>

아래 문서를 통해 먼저 web push 인증서를 등록해주세요.

{% content-ref url="../certification/web-push" %}
[web-push](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/push-notification/certification/web-push)
{% endcontent-ref %}

## 1. 연동 방법

푸시를 사용하기 위해서는, Marketap SDK가 고객사 도메인에서 서비스 워커 스크립트를 조회할 수 있어야 합니다.

콘솔을 통해 웹푸시를 사용으로 설정 후, 제공된 서비스 워커 파일을 다운로드 해주세요.

<figure><img src="https://260547158-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTQoY0rYrzNUQxhlUfYFm%2Fuploads%2FAaET8xpP4JEgWmdCpzRG%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202025-08-05%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%208.02.32.png?alt=media&#x26;token=03cb5838-780c-479a-9175-a964ab88f195" alt=""><figcaption></figcaption></figure>

다운로드 받은 파일을 서비스하는 도메인의 지정된 `path`에서 읽어갈 수 있도록 설정해주세요. 아래 그림과 같이 `https://{domain}/{script_path}` 를 주소창에 입력하였을 때, 아래와 같이 마켓탭이 제공한 스크립트가 노출되어야 합니다.

<figure><img src="https://260547158-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTQoY0rYrzNUQxhlUfYFm%2Fuploads%2F3meUHSd3HAAzwTTOuWhf%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202025-07-17%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%201.59.02.png?alt=media&#x26;token=e075acff-b8ab-42b5-96fa-4324af1a46e8" alt=""><figcaption></figcaption></figure>

{% hint style="danger" %}
스크립트 파일은 어떤 환경(local, dev, prod)에서든 콘솔에 지정한 path를 통해 접근이 가능해야만 웹푸시를 사용할 수 있습니다. 테스트 환경에서도 설정한 경로를 통해 js파일이 잘 불러와지는지 확인해주세요!
{% endhint %}

## 2. 이어서 진행하기

이제 Web Push Notification 연동이 완료되었습니다! 아래 문서에서 이어서 진행해주세요.

{% content-ref url="../test/web-push" %}
[web-push](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/push-notification/test/web-push)
{% endcontent-ref %}