From 3e3559ca7cb65269042609b5fc01ad524fdb95b2 Mon Sep 17 00:00:00 2001 From: Saigredan Date: Fri, 5 Feb 2021 16:13:11 +0100 Subject: [PATCH] Fix server side rendering --- src/Utils/AdManager.ts | 106 ++++++++++++++++++++----------------- src/Utils/headerScripts.ts | 40 +++++++------- 2 files changed, 80 insertions(+), 66 deletions(-) diff --git a/src/Utils/AdManager.ts b/src/Utils/AdManager.ts index 1fc6715..c7924c4 100644 --- a/src/Utils/AdManager.ts +++ b/src/Utils/AdManager.ts @@ -26,60 +26,70 @@ export class AdManager { targeting?: { [key: string]: googletag.NamedSize } ): Promise { return new Promise((resolve, reject) => { - window.Yieldbird.cmd.push(() => { - window.googletag.cmd.push(() => { - const slot = this.createSlot(adUnitPath, size, optDiv) - - this.setTargeting(slot, targeting) - this.setSizeMapping(slot, sizeMapping) - - if (!shouldRefreshAds) { - window.Yieldbird.setGPTTargeting([slot]) - window.googletag.enableServices() - window.googletag.display(optDiv) - window.googletag.pubads().refresh([slot]) - } else { - window.googletag.enableServices() - window.googletag.display(optDiv) - } - - slot ? resolve(slot) : reject(new Error('Slot could not be created.')) + if (typeof window !== 'undefined') { + window.Yieldbird.cmd.push(() => { + window.googletag.cmd.push(() => { + const slot = this.createSlot(adUnitPath, size, optDiv) + + this.setTargeting(slot, targeting) + this.setSizeMapping(slot, sizeMapping) + + if (!shouldRefreshAds) { + window.Yieldbird.setGPTTargeting([slot]) + window.googletag.enableServices() + window.googletag.display(optDiv) + window.googletag.pubads().refresh([slot]) + } else { + window.googletag.enableServices() + window.googletag.display(optDiv) + } + + slot + ? resolve(slot) + : reject(new Error('Slot could not be created.')) + }) }) - }) + } else { + reject(new Error('Slot could not be created.')) + } }) } public static destroySlot(optDiv: string) { - window.googletag.cmd.push(() => { - const slot = window.googletag - .pubads() - .getSlots() - .find((el) => el.getSlotElementId() === optDiv) - - slot && window.googletag.destroySlots([slot]) - }) + if (typeof window !== 'undefined') { + window.googletag.cmd.push(() => { + const slot = window.googletag + .pubads() + .getSlots() + .find((el) => el.getSlotElementId() === optDiv) + + slot && window.googletag.destroySlots([slot]) + }) + } } public refreshSlot(slot: googletag.Slot, optDiv: string) { - this.adsToRefresh[optDiv] = slot - - this.interval && window.clearInterval(this.interval) - this.interval = window.setTimeout( - () => { - const slots = Object.keys(this.adsToRefresh).map( - (el) => this.adsToRefresh[el] - ) - - if (slots.length > 0) { - window.Yieldbird.cmd.push(() => { - window.Yieldbird.refresh(slots) - this.adsToRefresh = {} - }) - } - }, - this.timeout, - true - ) + if (typeof window !== 'undefined') { + this.adsToRefresh[optDiv] = slot + + this.interval && window.clearInterval(this.interval) + this.interval = window.setTimeout( + () => { + const slots = Object.keys(this.adsToRefresh).map( + (el) => this.adsToRefresh[el] + ) + + if (slots.length > 0) { + window.Yieldbird.cmd.push(() => { + window.Yieldbird.refresh(slots) + this.adsToRefresh = {} + }) + } + }, + this.timeout, + true + ) + } } private static createSlot( @@ -107,9 +117,9 @@ export class AdManager { slot: googletag.Slot, targeting?: { [key: string]: googletag.NamedSize } ) { - if (targeting) { + if (slot && targeting) { Object.keys(targeting).forEach((targetingKey: string) => { - slot && slot.setTargeting(targetingKey, targeting[targetingKey]) + slot.setTargeting(targetingKey, targeting[targetingKey]) }) } } diff --git a/src/Utils/headerScripts.ts b/src/Utils/headerScripts.ts index a812f95..6d50956 100644 --- a/src/Utils/headerScripts.ts +++ b/src/Utils/headerScripts.ts @@ -8,29 +8,33 @@ function loadScript(scriptUrl: string) { } export function ensureScripts() { - window.googletag = window.googletag || {} - window.googletag.cmd = window.googletag.cmd || [] - window.Yieldbird = window.Yieldbird || {} - window.Yieldbird.cmd = window.Yieldbird.cmd || [] + if (typeof window !== 'undefined') { + window.googletag = window.googletag || {} + window.googletag.cmd = window.googletag.cmd || [] + window.Yieldbird = window.Yieldbird || {} + window.Yieldbird.cmd = window.Yieldbird.cmd || [] + } } export function initializeAdStack(uuid: string) { - ensureScripts() - window.yb_configuration = { lazyLoad: true } + if (typeof window !== 'undefined') { + ensureScripts() + window.yb_configuration = { lazyLoad: true } - window.googletag.cmd.push(function () { - window.googletag.pubads().disableInitialLoad() - }) + window.googletag.cmd.push(function () { + window.googletag.pubads().disableInitialLoad() + }) - if (Object.keys(window.googletag).length <= 1) { - loadScript( - `${document.location.protocol}//securepubads.g.doubleclick.net/tag/js/gpt.js` - ) - } + if (Object.keys(window.googletag).length <= 1) { + loadScript( + `${document.location.protocol}//securepubads.g.doubleclick.net/tag/js/gpt.js` + ) + } - if (Object.keys(window.Yieldbird).length <= 1) { - loadScript( - `${document.location.protocol}//jscdn.yieldbird.com/${uuid}/yb.js` - ) + if (Object.keys(window.Yieldbird).length <= 1) { + loadScript( + `${document.location.protocol}//jscdn.yieldbird.com/${uuid}/yb.js` + ) + } } }