fix: allow origin and catalog endpoints in config

src/index.js

@@ -23,19 +23,23 @@ import { resolveConfig } from './config.js';
  * @param {Config} config
  */
 async function fetchProductCS(sku, config) {
+  const { catalogEndpoint = 'https://catalog-service.adobe.io/graphql' } = config;
   const query = getProductQueryCS({ sku });
-
-  const resp = await fetch(`https://catalog-service.adobe.io/graphql?query=${encodeURIComponent(query)}`, {
+  const resp = await fetch(`${catalogEndpoint}?query=${encodeURIComponent(query)}`, {
     headers: {
-      origin: 'https://api.adobecommerce.live',
+      origin: config.origin ?? 'https://api.adobecommerce.live',
       'x-api-key': config.apiKey,
       'Magento-Environment-Id': config.magentoEnvironmentId,
       'Magento-Website-Code': config.magentoWebsiteCode,
       'Magento-Store-View-Code': config.magentoStoreViewCode,
+      'Magento-Store-Code': config.magentoStoreCode,
     },
   });
   if (!resp.ok) {
     console.warn('failed to fetch product: ', resp.status, resp.statusText);
+    try {
+      console.info('body: ', await resp.text());
+    } catch { /* noop */ }
     throw errorWithResponse(resp.status, 'failed to fetch product');
   }
 
@@ -66,15 +70,19 @@ async function fetchProductCore(opt, config) {
 
   const resp = await fetch(`${config.coreEndpoint}?query=${encodeURIComponent(query)}`, {
     headers: {
-      origin: 'https://api.adobecommerce.live',
+      origin: config.origin ?? 'https://api.adobecommerce.live',
       'x-api-key': config.apiKey,
       'Magento-Environment-Id': config.magentoEnvironmentId,
       'Magento-Website-Code': config.magentoWebsiteCode,
       'Magento-Store-View-Code': config.magentoStoreViewCode,
+      'Magento-Store-Code': config.magentoStoreCode,
     },
   });
   if (!resp.ok) {
     console.warn('failed to fetch product: ', resp.status, resp.statusText);
+    try {
+      console.info('body: ', await resp.text());
+    } catch { /* noop */ }
     throw errorWithResponse(resp.status, 'failed to fetch product');
   }
 
@@ -99,19 +107,24 @@ async function lookupProductSKU(urlkey, config) {
   const query = getProductSKUQuery({ urlkey });
   const resp = await fetch(`${config.coreEndpoint}?query=${encodeURIComponent(query)}`, {
     headers: {
-      origin: 'https://api.adobecommerce.live',
+      origin: config.origin ?? 'https://api.adobecommerce.live',
       'x-api-key': config.apiKey,
       'Magento-Environment-Id': config.magentoEnvironmentId,
       'Magento-Website-Code': config.magentoWebsiteCode,
       'Magento-Store-View-Code': config.magentoStoreViewCode,
+      'Magento-Store-Code': config.magentoStoreCode,
     },
   });
   if (!resp.ok) {
     console.warn('failed to fetch product sku: ', resp.status, resp.statusText);
+    try {
+      console.info('body: ', await resp.text());
+    } catch { /* noop */ }
     throw errorWithResponse(resp.status, 'failed to fetch product sku');
   }
 
   const json = await resp.json();
+  console.log('json: ', JSON.stringify(json, undefined, 2));
   try {
     const [product] = json.data.products.items;
     if (!product) {
@@ -193,6 +206,7 @@ export default {
     try {
       const overrides = Object.fromEntries(ctx.url.searchParams.entries());
       const config = await resolveConfig(ctx, tenant, overrides);
+      console.debug('resolved config: ', JSON.stringify(config, undefined, 2));
       if (!config) {
         return errorResponse(404, 'config not found');
       }

src/templates/html.js

@@ -47,12 +47,12 @@ export default (product) => {
       <title>${metaTitle || name}</title>
       <meta property="description" content="${metaDescription || description}">
       <meta property="og:title" content="${metaTitle || name}">
-      <meta property="og:image" content="${images[0].url}">
-      <meta property="og:image:secure_url" content="${images[0].url}">
+      <meta property="og:image" content="${images[0]?.url}">
+      <meta property="og:image:secure_url" content="${images[0]?.url}">
       <meta property="og:type" content="og:product">
       <meta name="twitter:card" content="summary_large_image">
       <meta name="twitter:title" content="${metaTitle || name}">
-      <meta name="twitter:image" content="${images[0].url}">
+      <meta name="twitter:image" content="${images[0]?.url}">
       <meta name="keywords" content="${metaKeyword}">
       <meta name="sku" content="${sku}">
       <meta name="urlKey" content="${urlKey}">

src/templates/json-ld.js

@@ -31,7 +31,7 @@ export default (product) => {
     prices,
   } = product;
 
-  const image = images?.[0].url;
+  const image = images?.[0]?.url;
   const brandName = attributes.find((attr) => attr.name === 'brand')?.value;
 
   return JSON.stringify(pruneUndefined({

src/types.d.ts

@@ -3,12 +3,14 @@ import type { ExecutionContext, KVNamespace } from "@cloudflare/workers-types/ex
 declare global {
   export interface Config {
     pageType: 'product' | string;
+    origin?: string;
     apiKey: string;
     magentoEnvironmentId: string;
     magentoWebsiteCode: string;
     magentoStoreViewCode: string;
     magentoStoreCode: string;
     coreEndpoint: string;
+    catalogEndpoint?: string;
     params: Record<string, string>;
   }