@streamlayer/feature-advertisement 1.0.0 → 1.1.1-rc.1342

package/lib/classic/units/external-ad.js

@@ -0,0 +1,447 @@
+import { asyncToGenerator as _asyncToGenerator } from '../_virtual/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.symbol.description.js';
+import 'core-js/modules/es.error.cause.js';
+import 'core-js/modules/es.array.iterator.js';
+import 'core-js/modules/es.array.reduce.js';
+import 'core-js/modules/es.array.sort.js';
+import 'core-js/modules/es.json.stringify.js';
+import 'core-js/modules/es.promise.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/es.string.replace-all.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.iterator.find.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/esnext.iterator.reduce.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/web.url.js';
+import 'core-js/modules/web.url.to-json.js';
+import 'core-js/modules/web.url-search-params.js';
+import 'core-js/modules/web.url-search-params.delete.js';
+import 'core-js/modules/web.url-search-params.has.js';
+import 'core-js/modules/web.url-search-params.size.js';
+import { createLogger } from '@streamlayer/sdk-web-logger/classic';
+import { VASTClient, VASTParser } from '@dailymotion/vast-client';
+import '@streamlayer/sdk-web-api/classic';
+import VMAP from 'vmap';
+import { gam } from './gam.js';
+import { parseVastExtension } from './parse-vast-extensions.js';
+
+const log = createLogger('ui:gam-external-ad');
+/** Default budget for a single VAST resolution before it is treated as "no ad". */
+const VAST_FETCH_TIMEOUT_MS = 10000;
+/**
+ * Resolve `promise`, but fall back to `undefined` if it doesn't settle within `ms`.
+ * A slow/unreachable VAST endpoint must degrade to "no ad" instead of leaving the
+ * fetcher (and the sidebar) stuck waiting. Uses a timer rather than `AbortController`
+ * so it stays safe on the ES5/Chrome-32 target.
+ */
+const withTimeout = (promise, ms) => {
+  return Promise.race([promise, new Promise(resolve => {
+    setTimeout(() => resolve(undefined), ms);
+  })]);
+};
+// const preloadImage = (src: string) => {
+//   return new Promise((resolve, reject) => {
+//     const image = new Image()
+//     image.onload = () => resolve(src)
+//     image.onerror = () => reject()
+//     image.src = src
+//   })
+// }
+/**
+ * Get the first valid creative from an ad
+ */
+const getCreative = ad => {
+  return ad.creatives.find(creative => creative.mediaFiles);
+};
+/**
+ * Get the URL of the first media file in the creative
+ */
+const getMediaFileUrl = creative => {
+  var _mediaFiles$find;
+  const mediaFiles = creative === null || creative === void 0 ? void 0 : creative.mediaFiles;
+  if (!(mediaFiles !== null && mediaFiles !== void 0 && mediaFiles.length)) {
+    return '';
+  }
+  return ((_mediaFiles$find = mediaFiles.find(mediaFile => mediaFile.fileURL)) === null || _mediaFiles$find === void 0 ? void 0 : _mediaFiles$find.fileURL) || '';
+};
+/**
+ * Extract the linear creative's `<ClickThrough>` URL. Sources the sidebar CTA (QR code
+ * + click-through). `videoClickThroughURLTemplate` isn't strongly typed in the client lib.
+ */
+const getClickThrough = creative => {
+  var _creative$videoClickT;
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-ignore — vast-client types `videoClickThroughURLTemplate` loosely
+  return (creative === null || creative === void 0 || (_creative$videoClickT = creative.videoClickThroughURLTemplate) === null || _creative$videoClickT === void 0 ? void 0 : _creative$videoClickT.url) || undefined;
+};
+/**
+ * Extract every `<Companion>` variation of the first `<CompanionAds>` creative that carries a
+ * `<StaticResource>`, in document order. `width`/`height` are XML attributes (strings at
+ * runtime), normalised to numbers so the size mapping can compare them.
+ */
+const getCompanions = ad => {
+  const creative = ad.creatives.find(item => item.type === 'companion');
+  return ((creative === null || creative === void 0 ? void 0 : creative.variations) || []).reduce((acc, variation) => {
+    var _variation$staticReso, _variation$companionC;
+    const imageUrl = variation === null || variation === void 0 || (_variation$staticReso = variation.staticResources) === null || _variation$staticReso === void 0 || (_variation$staticReso = _variation$staticReso[0]) === null || _variation$staticReso === void 0 ? void 0 : _variation$staticReso.url;
+    if (!imageUrl) {
+      return acc;
+    }
+    return acc.concat({
+      imageUrl,
+      clickUrl: (_variation$companionC = variation.companionClickThroughURLTemplate) !== null && _variation$companionC !== void 0 ? _variation$companionC : undefined,
+      width: Number(variation.width) || undefined,
+      height: Number(variation.height) || undefined,
+      creative,
+      variation
+    });
+  }, []);
+};
+/** Product companion mapping: the 300x75 companion is the logo, the banner-sized one the media. */
+const LOGO_COMPANION_WIDTH = 300;
+const LOGO_COMPANION_HEIGHT = 75;
+const companionArea = companion => (companion.width || 0) * (companion.height || 0);
+/**
+ * Split a `<CompanionAds>` creative's variations into the logo and media slots.
+ *
+ * The pair mapping activates only for a tag that ships an exact 300x75 companion next to at
+ * least one other. Deliberately conservative pending broader product sizes: on any other tag
+ * no companion is promoted to the logo slot and the first one stays the media/strip candidate.
+ */
+const selectCompanions = companions => {
+  const logo = companions.length > 1 ? companions.find(companion => companion.width === LOGO_COMPANION_WIDTH && companion.height === LOGO_COMPANION_HEIGHT) : undefined;
+  if (!logo) {
+    return {
+      logo: undefined,
+      media: companions[0]
+    };
+  }
+  const media = companions.filter(companion => companion !== logo).sort((a, b) => companionArea(a) - companionArea(b)).pop();
+  return {
+    logo,
+    media
+  };
+};
+/**
+ * Extract the first `<NonLinearAds>` creative's static-image variation. Both the creative (which
+ * owns the `<TrackingEvents>`) and the variation (which owns the click-through) are kept —
+ * `VASTTracker` needs both.
+ *
+ * `@dailymotion/vast-client` 6.4.2 emits `nonlinearClickThroughURLTemplate` (lower-case `l`),
+ * which the `@types/vast-client` shim declares as `nonLinearClickThroughURLTemplate` — the
+ * runtime spelling is authoritative.
+ */
+const getNonLinear = ad => {
+  var _creative$variations, _variation$nonlinearC;
+  const creative = ad.creatives.find(item => item.type === 'nonlinear');
+  const variation = creative === null || creative === void 0 || (_creative$variations = creative.variations) === null || _creative$variations === void 0 ? void 0 : _creative$variations[0];
+  const imageUrl = variation === null || variation === void 0 ? void 0 : variation.staticResource;
+  if (!creative || !variation || !imageUrl) {
+    return undefined;
+  }
+  return {
+    imageUrl,
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore — see the runtime-vs-shim spelling note above
+    clickUrl: (_variation$nonlinearC = variation.nonlinearClickThroughURLTemplate) !== null && _variation$nonlinearC !== void 0 ? _variation$nonlinearC : undefined,
+    width: Number(variation.width) || undefined,
+    height: Number(variation.height) || undefined,
+    creative,
+    variation
+  };
+};
+/**
+ * Map a parsed VAST response into our `AdData` shape. Shared by both acquisition
+ * paths — the GAM/VMAP tag flow and the Prebid auction flow — so the two always
+ * produce identical downstream data. Returns `undefined` when the response has no
+ * ad carrying creatives.
+ */
+const buildAdData = (parsedVAST, order) => {
+  var _validAd$extensions$f;
+  const validAd = parsedVAST.ads.find(ads => ads.creatives.length > 0);
+  if (!validAd) {
+    log.warn({
+      order,
+      ads: parsedVAST.ads.length
+    }, 'vast response carries no ad with creatives — treated as no-ad');
+    return undefined;
+  }
+  const extension = (_validAd$extensions$f = validAd.extensions.find(ext => ext.attributes.type.startsWith('streamlayer'))) === null || _validAd$extensions$f === void 0 ? void 0 : _validAd$extensions$f.children[0];
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-expect-error
+  const parsedExtension = parseVastExtension(extension);
+  const creative = getCreative(validAd);
+  const mediaFileUrl = getMediaFileUrl(creative);
+  const companions = getCompanions(validAd);
+  const {
+    logo,
+    media: mediaCompanion
+  } = selectCompanions(companions);
+  const nonLinear = getNonLinear(validAd);
+  const clickThrough = getClickThrough(creative) || (nonLinear === null || nonLinear === void 0 ? void 0 : nonLinear.clickUrl) || (mediaCompanion === null || mediaCompanion === void 0 ? void 0 : mediaCompanion.clickUrl);
+  log.info({
+    order,
+    adId: validAd.id,
+    title: validAd.title || undefined,
+    found: {
+      linear: !!creative,
+      mediaFile: mediaFileUrl || undefined,
+      nonLinear: nonLinear ? `${nonLinear.width}x${nonLinear.height}` : undefined,
+      companions: companions.map(item => `${item.width}x${item.height}`)
+    },
+    selected: {
+      logo: logo ? {
+        size: `${logo.width}x${logo.height}`,
+        url: logo.imageUrl
+      } : undefined,
+      media: mediaCompanion ? {
+        size: `${mediaCompanion.width}x${mediaCompanion.height}`,
+        url: mediaCompanion.imageUrl
+      } : undefined,
+      clickThrough: !!clickThrough
+    }
+  }, 'vast ad parsed');
+  return {
+    creative,
+    order,
+    mediaFileUrl,
+    companion: companions[0],
+    logo,
+    mediaCompanion,
+    nonLinear,
+    clickThrough,
+    title: validAd.title || undefined,
+    description: validAd.description || undefined,
+    ad: validAd,
+    extension: parsedExtension,
+    raw: parsedVAST
+  };
+};
+/** Path of the self-hosted Prebid Server OpenRTB auction endpoint. */
+const PREBID_AUCTION_PATH = '/openrtb2/auction';
+/**
+ * A Prebid link points at our Prebid Server auction endpoint (staging:
+ * `https://prebid.next.streamlayer.io/openrtb2/auction`) rather than at a VAST tag.
+ * Detected by path so both staging and production hosts match.
+ */
+const isPrebidUrl = url => url.pathname.endsWith(PREBID_AUCTION_PATH);
+/** Unique per-auction request id — Prebid responses are never cached/reused (RFC §5). */
+const createRequestId = () => `sl-web-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 10)}`;
+/**
+ * Build the OpenRTB request body for a single video auction. Placement config is
+ * carried on the Prebid link's query string so the consumer-facing interface stays a
+ * single URL string:
+ * - `configId` → `imp.ext.prebid.storedrequest.id` (production stored request).
+ * - `storedauctionresponse` → `imp.ext.prebid.storedauctionresponse.id` (staging mock).
+ * - `test=1` → top-level `test` flag.
+ * - `w` / `h` → video dimensions (default 1920×1080).
+ */
+const buildAuctionRequest = url => {
+  var _ref, _params$get, _params$get2;
+  const params = url.searchParams;
+  const width = Number(params.get('w')) || 1920;
+  const height = Number(params.get('h')) || 1080;
+  const configId = (_ref = (_params$get = params.get('configId')) !== null && _params$get !== void 0 ? _params$get : params.get('config_id')) !== null && _ref !== void 0 ? _ref : undefined;
+  const storedAuctionResponse = (_params$get2 = params.get('storedauctionresponse')) !== null && _params$get2 !== void 0 ? _params$get2 : undefined;
+  const prebid = {};
+  if (storedAuctionResponse) {
+    prebid.storedauctionresponse = {
+      id: storedAuctionResponse
+    };
+  }
+  if (configId) {
+    prebid.storedrequest = {
+      id: configId
+    };
+  }
+  prebid.bidder = {
+    appnexus: {
+      placementId: 13144370
+    }
+  };
+  const request = {
+    id: createRequestId(),
+    imp: [{
+      id: '1',
+      video: {
+        mimes: ['video/mp4'],
+        protocols: [2, 3, 5, 6],
+        w: width,
+        h: height,
+        placement: 1,
+        linearity: 1
+      },
+      ext: {
+        prebid
+      }
+    }],
+    site: {
+      page: typeof location !== 'undefined' ? location.href : url.origin
+    },
+    tmax: 500
+  };
+  if (params.get('test') === '1') {
+    request.test = 1;
+  }
+  return request;
+};
+/**
+ * Run one Prebid Server auction and turn the winning inline VAST into an `AdStore`.
+ * Every bid's `adm` is inline VAST XML (no URL to fetch); bids are ordered by price
+ * so the winner plays first (RFC §2). A single bad bid must not drop the batch.
+ */
+const fetchPrebidAds = /*#__PURE__*/function () {
+  var _ref2 = _asyncToGenerator(function* (prebidUrl) {
+    var _auction$seatbid, _params$get3, _params$get4;
+    const response = yield fetch(prebidUrl.toString(), {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify(buildAuctionRequest(prebidUrl))
+    });
+    if (!response.ok) {
+      throw new Error(`prebid auction failed with status ${response.status}`);
+    }
+    const auction = yield response.json();
+    const bids = ((_auction$seatbid = auction.seatbid) !== null && _auction$seatbid !== void 0 ? _auction$seatbid : []).reduce((acc, seat) => {
+      var _seat$bid;
+      return acc.concat((_seat$bid = seat.bid) !== null && _seat$bid !== void 0 ? _seat$bid : []);
+    }, []).filter(bid => !!bid.adm)
+    // Highest price wins — the winner is order 0 (RFC §2).
+    .sort((a, b) => {
+      var _b$price, _a$price;
+      return ((_b$price = b.price) !== null && _b$price !== void 0 ? _b$price : 0) - ((_a$price = a.price) !== null && _a$price !== void 0 ? _a$price : 0);
+    });
+    const parser = new DOMParser();
+    const loadedAds = yield Promise.all(bids.map((bid, i) => {
+      const xmlDoc = parser.parseFromString(bid.adm, 'text/xml');
+      // A fresh `VASTParser` per bid isolates parser state, mirroring the fresh
+      // `VASTClient` per link in the tag flow. `resolveAll: true` follows any
+      // `VASTAdTagURI` wrapper chain the bid's inline VAST may still contain.
+      return new VASTParser()
+      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+      // @ts-ignore
+      .parseVAST(xmlDoc, {
+        resolveAll: true,
+        wrapperLimit: 10,
+        allowMultipleAds: true
+      }).then(parsedVAST => buildAdData(parsedVAST, i)).catch(err => {
+        // A single failing bid must not drop the whole batch.
+        log.error(err, 'failed to parse prebid VAST');
+        return undefined;
+      });
+    }));
+    const params = prebidUrl.searchParams;
+    const autoplay = ((_params$get3 = params.get('vpa')) === null || _params$get3 === void 0 ? void 0 : _params$get3.replaceAll('?', '')) !== 'click';
+    const muted = ((_params$get4 = params.get('vpmute')) === null || _params$get4 === void 0 ? void 0 : _params$get4.replaceAll('?', '')) === '1';
+    return {
+      ads: loadedAds.filter(d => !!d),
+      autoplay,
+      muted
+    };
+  });
+  return function fetchPrebidAds(_x) {
+    return _ref2.apply(this, arguments);
+  };
+}();
+const externalAd = instance => {
+  return gamUrl => instance.transport.nanoquery.createFetcherStore([gamUrl], {
+    dedupeTime: Infinity,
+    revalidateInterval: 0,
+    fetcher: function () {
+      var _ref3 = _asyncToGenerator(function* (adUrl) {
+        var _noncedLink$searchPar, _noncedLink$searchPar2, _noncedLink$searchPar3;
+        if (!adUrl || typeof adUrl !== 'string') {
+          throw new Error('ad url is empty');
+        }
+        const parsedAdUrl = (() => {
+          try {
+            return new URL(adUrl);
+          } catch (_unused) {
+            return undefined;
+          }
+        })();
+        // Prebid links hit our Prebid Server auction endpoint instead of a VAST tag.
+        // Run the OpenRTB auction and parse the winning bid's inline VAST (`adm`) into
+        // the same `AdStore` shape the GAM/VMAP path returns. See rfcs/prebid.
+        if (parsedAdUrl && isPrebidUrl(parsedAdUrl)) {
+          return fetchPrebidAds(parsedAdUrl);
+        }
+        const generateUrl = gam(adUrl);
+        const generatedUrl = yield generateUrl();
+        const noncedLink = generatedUrl === null || generatedUrl === void 0 ? void 0 : generatedUrl.url;
+        if (!noncedLink) {
+          throw new Error('ad url is not generated');
+        }
+        let links;
+        if (((_noncedLink$searchPar = noncedLink.searchParams.get('output')) === null || _noncedLink$searchPar === void 0 ? void 0 : _noncedLink$searchPar.replaceAll('?', '')) === 'vmap') {
+          const response = yield withTimeout(fetch(noncedLink.toString()), VAST_FETCH_TIMEOUT_MS);
+          if (!response) {
+            throw new Error('vmap fetch timed out');
+          }
+          const parser = new DOMParser();
+          const xmlStr = yield response.text();
+          const xmlDoc = parser.parseFromString(xmlStr, 'text/xml');
+          const vmap = new VMAP(xmlDoc);
+          links = vmap.adBreaks.map(ad => {
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-expect-error
+            return ad.adSource.adTagURI.uri;
+          });
+        } else {
+          links = [noncedLink.toString()];
+        }
+        const loadedAds = yield Promise.all(links.map((link, i) => {
+          // `resolveAll: true` makes the client follow every `VASTAdTagURI` wrapper chain
+          // (up to the default depth of 10) and resolve all Ads, merging wrapper-level
+          // Impression/tracking URLs into the inline Ad. The default (`resolveAll: false`)
+          // only resolves the first standalone Ad and defers wrappers/remaining Ads to
+          // `getNextAds()`, which this fetcher never calls. A fresh `VASTClient` per link
+          // isolates parser state so concurrent (VMAP) resolutions don't clobber each other.
+          return withTimeout(new VASTClient()
+          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+          // @ts-ignore
+          .get(link, {
+            resolveAll: true,
+            wrapperLimit: 10,
+            allowMultipleAds: true
+          }), VAST_FETCH_TIMEOUT_MS).then(parsedVAST => {
+            // `parsedVAST` is `undefined` when the resolution timed out (see `withTimeout`).
+            if (!parsedVAST) {
+              log.warn({
+                link,
+                timeoutMs: VAST_FETCH_TIMEOUT_MS
+              }, 'vast resolution timed out — treated as no-ad');
+              return undefined;
+            }
+            return buildAdData(parsedVAST, i);
+          }).catch(err => {
+            // A single failing wrapper chain must not drop the whole batch.
+            log.error(err, 'failed to resolve VAST');
+            return undefined;
+          });
+        }));
+        const autoplay = ((_noncedLink$searchPar2 = noncedLink.searchParams.get('vpa')) === null || _noncedLink$searchPar2 === void 0 ? void 0 : _noncedLink$searchPar2.replaceAll('?', '')) !== 'click';
+        const muted = ((_noncedLink$searchPar3 = noncedLink.searchParams.get('vpmute')) === null || _noncedLink$searchPar3 === void 0 ? void 0 : _noncedLink$searchPar3.replaceAll('?', '')) === '1';
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-expect-error
+        const nonceManager = generatedUrl.manager;
+        return {
+          ads: loadedAds.filter(d => !!d),
+          autoplay,
+          muted,
+          nonceManager
+        };
+      });
+      return function fetcher(_x2) {
+        return _ref3.apply(this, arguments);
+      };
+    }()
+  });
+};
+
+export { externalAd };