프레임워크
ConsentX 도입 가이드: React & Next.js
문서 head에서 모든 React 또는 Next.js 앱에 ConsentX를 로드하십시오.
요약
React & Next.js에 쿠키 동의 배너를 추가하려면 ConsentX 스니펫을 사이트 head에 한 번 붙여넣으십시오. Next.js에서는 app/layout.tsx의 <head> 안에 스니펫을 추가하십시오(또는 strategy를 beforeInteractive로 지정한 next/script를 사용하십시오). 일반 React 앱에서는 public/index.html의 </head> 앞에 추가하십시오. 이후 배너는 모든 페이지에서 로드되어 동의 전에 필수가 아닌 트래커를 차단하고, 대시보드에서 설정한 DPDPA, GDPR, CCPA 규칙을 적용합니다.
React & Next.js에 설치하기
1
스니펫 복사
ConsentX에서 Install을 열고 계정의 임베드 스니펫을 복사하십시오. 도메인 범위로 한정된 작은 <script> 태그 하나입니다.
2
head에 붙여넣기
Next.js에서는 app/layout.tsx의 <head>에 스니펫을 추가하거나 strategy='beforeInteractive'로 next/script를 사용하십시오. 일반 React에서는 public/index.html의 </head> 앞에 추가하십시오.
3
게시
사이트를 저장하고 게시하십시오. 다음 로드 시 동의 배너가 표시됩니다.
4
대시보드에서 설정
ConsentX에서 배너 디자인, 쿠키 카테고리, 지역별 규칙을 설정하십시오. 변경 사항은 재배포 없이 운영 중인 사이트에 반영됩니다.
원태그 설치
사이트 head에 스니펫을 한 번만 추가하십시오. 배너가 모든 페이지에서 자동으로 로드됩니다.
Consent Mode v2 + 사전 차단
Google 신호는 기본적으로 거부되며, 방문자가 선택할 때까지 필수가 아닌 트래커는 비활성 상태로 유지됩니다.
위치 인식 규칙
하나의 배너가 대시보드 설정에 따라 GDPR, CCPA, LGPD, DPDPA에 맞게 조정되며 재배포가 필요 없습니다.