Redirector page, redux
A long way back, you learned that direct links to static assets (like, say, a PDF) won’t be tracked by Munchkin. You should instead have a central Redirector LP that hooks up the Munchkin cookie before flipping to the target asset.
Later, I showed how to instrument Munchkin so an event fires as soon as Visit Web Page has been logged, allowing the fastest response for Munchkin-dependent stuff — like redirecting.
Hadn’t yet wrapped together those 2 concepts, though. So here’s how you should set up the Redirector LP in the modern age (as of late 2024).
First, download the HitEvent JS from my CDN and re-upload it to your Design Studio:
Load that file in the <head>
of your Redirector LP:
<!-- Munchkin event enabler -->
<script src="https://pages.example.com/rs/123-ABC-456/teknkl-munchkinhitevent-v1.js"></script>
<!-- /Munchkin event enabler -->
It’s critical that it load before the Munchkin library, which gets automatically injected at the end of the </body>
, so the safe way is to put it in <head>
.
Then use this JS instead of the original redirector JS:
redirect: {
const allowedOrigins = [ // which domains are allowed for redirection
"https://pages.example.com",
"https://www.example.com",
"https://example.com"
];
const errNoAsset = "Asset URL not found."; // message when no asset in hash
const errInvalidAsset = "Asset URL not allowed."; // when asset not our domain
const redirectMs = 2000;
let assetURL;
try {
assetURL = new URL(decodeURIComponent(document.location.hash.substring(1)));
} catch(e){
document.body.append(errNoAsset);
break redirect;
}
if(!allowedOrigins.includes(assetURL.origin)){
document.body.append(errInvalidAsset);
break redirect;
}
enableMunchkinHitEvent({ forceAfter: redirectMs, debug: true });
document.addEventListener("munchkin.visitWebPage", function(e){
document.location.href = assetURL.href;
});
}
The JS is less clunky now as browsers do a lot more stuff natively than they did back in 2017 (!!).