01
The ordering contract
01 BootstrapRead GPC and stored denial02 Optional tagsOnly after the decision boundary03 ApplicationHydrate any framework
02
Render safe markup on the server
typescript
import { renderPactBootstrap } from '@pact/web'
const pactBootstrap = renderPactBootstrap({
siteKey: 'site_live_your_key',
src: '/pact.js',
apiBase: '/v1',
})
// Render pactBootstrap as trusted HTML at the start of <head>.
// It must appear before analytics, advertising, or other optional code.03
Forward server-known signals
html
<script id="pact-bootstrap"
data-tenant="site_live_your_key"
data-src="/pact.js"
data-api="/v1"
data-gpc="1"
data-allow="0">
((e,r,o)=>{let a=location.search,c=(a.match(/region=(CA|TX|EU)/)||[,"CA"])[1],n=r.currentScript.dataset,t="1"==n.gpc||o.globalPrivacyControl||a.includes("gpc=1"),i=!t&&"EU"!=c&&"0"!=n.allow,l=n.src||"/pact.js",p=()=>import(l);(e.pact={ready:0,purposes:{marketing:i},gpc:!!t,region:c,on:()=>()=>0,allow:p,deny:p,openPreferences:p}).ready="TX"==c?Promise.resolve():p()})(window,document,navigator);
</script>Use data-gpc="1" when the request carried Sec-GPC: 1. Use data-allow="0" after a stored marketing rejection. Never use client hydration as the first place these restrictions appear.