orionplace-nuxt 0.1.2 → 0.2.0

package/runtime/marketplace.mjs

@@ -1,211 +1,287 @@
-import { readFile } from 'node:fs/promises';
-import { resolve } from 'node:path';
-import { isIP } from 'node:net';
-
-const environment = process.env;
-
-const hostnamePattern =
-	/^(?=.{1,253}$)(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?$/;
-
-/** @param {unknown} value */
-export function normalizeFrontDomain(value) {
-	if (typeof value !== 'string') return null;
-	const domain = value.split(',')[0].trim().toLowerCase().replace(/\.$/, '');
-	return hostnamePattern.test(domain) && !isIP(domain) ? domain : null;
-}
-
-/** @param {Request} request @param {string} mimic */
-export function resolveFrontDomain(
-	request,
-	mimic = environment.MIMIC_FRONT_DOMAIN || '',
-) {
-	// The hosting proxy must overwrite these headers. Public hosts win over MIMIC.
-	for (const candidate of [
-		request.headers.get('x-front-domain'),
-		request.headers.get('x-forwarded-host'),
-		request.headers.get('host'),
-		new URL(request.url).hostname,
-	]) {
-		const domain = normalizeFrontDomain(candidate);
-		if (domain) return domain;
-	}
-	return normalizeFrontDomain(mimic);
-}
-
-/** @param {Request} request @param {{mimicFrontDomain?: string}} configuration */
-export async function readMarketplace(request, configuration = {}) {
-	const domain = resolveFrontDomain(request, configuration.mimicFrontDomain);
-	if (!domain) throw new Error('Invalid storefront domain');
-
-	const directory = environment.SITEMAPS_DIR || resolve('sitemaps');
-	const source = await readFile(resolve(directory, `${domain}.cfg`), 'utf8');
-	const lines = source
-		.split(/\r?\n/)
-		.map((line) => line.trim())
-		.filter((line) => line && !line.startsWith('#'));
-	if (lines.length !== 1) throw new Error('Expected one API URL');
-	const value = lines[0];
-	const api = new URL(value.includes('://') ? value : `https://${value}`);
-	api.pathname = api.pathname.replace(/\/+$/, '');
-	if (
-		api.protocol !== 'https:' ||
-		!hostnamePattern.test(api.hostname) ||
-		!api.hostname.endsWith('.orionplace.app') ||
-		isIP(api.hostname) ||
-		api.port ||
-		api.username ||
-		api.password ||
-		api.search ||
-		api.hash ||
-		api.pathname !== '/api'
-	) {
-		throw new Error('Expected https://<project>.orionplace.app/api');
-	}
-	return { domain, api };
-}
-
-/** @param {number} status @param {string} message */
-function failure(status, message) {
-	return Response.json(
-		{ error: message },
-		{
-			status,
-			headers: {
-				'Cache-Control': 'no-store',
-				'Vary': 'Host, X-Forwarded-Host, X-Front-Domain',
-			},
-		},
-	);
-}
-
-/** @param {Request} request @param {{mimicFrontDomain?: string}} configuration */
-export async function forwardMarketplace(request, configuration = {}) {
-	let tenant;
-	try {
-		tenant = await readMarketplace(request, configuration);
-	} catch {
-		return failure(
-			503,
-			'Storefront domain configuration is missing or invalid',
-		);
-	}
-
-	const incoming = new URL(request.url);
-	if (!incoming.pathname.startsWith('/api/'))
-		return failure(404, 'Unknown API path');
-	// Prevent encoded separators or traversal from escaping the /api namespace.
-	let path;
-	try {
-		path = decodeURIComponent(incoming.pathname);
-	} catch {
-		return failure(400, 'Invalid API path');
-	}
-	if (
-		path.includes('\\') ||
-		/%(?:2e|2f|5c)/i.test(path) ||
-		path.split('/').some((part) => part === '.' || part === '..')
-	) {
-		return failure(400, 'Invalid API path');
-	}
-	const target = new URL(
-		incoming.pathname + incoming.search,
-		tenant.api.origin,
-	);
-	if (!target.pathname.startsWith('/api/'))
-		return failure(400, 'Invalid API path');
-
-	const origin = request.headers.get('origin');
-	const publicHost = request.headers.get('host') || incoming.host;
-	const originHosts = [publicHost, tenant.domain];
-	if (!['GET', 'HEAD', 'OPTIONS'].includes(request.method)) {
-		try {
-			if (
-				request.headers.get('sec-fetch-site') === 'cross-site' ||
-				(origin && !originHosts.includes(new URL(origin).host))
-			) {
-				return failure(403, 'Cross-site API request rejected');
-			}
-		} catch {
-			return failure(403, 'Invalid Origin');
-		}
-	}
-
-	// An allowlist excludes hop-by-hop and client-supplied routing headers.
-	const headers = new Headers();
-	for (const name of [
-		'accept',
-		'content-type',
-		'authorization',
-		'cookie',
-		'origin',
-		'referer',
-		'x-csrftoken',
-		'accept-language',
-		'user-agent',
-		'x-tz',
-	]) {
-		const value = request.headers.get(name);
-		if (value) headers.set(name, value);
-	}
-	headers.set('X-Front-Domain', tenant.domain);
-	headers.set('Accept-Encoding', 'identity');
-	const clientIp =
-		request.headers.get('x-init-ip') ||
-		request.headers.get('x-real-ip') ||
-		request.headers.get('x-forwarded-for')?.split(',')[0]?.trim();
-	if (clientIp) headers.set('X-Init-Ip', clientIp);
-	/** @type {RequestInit & { duplex: 'half' }} */
-	const options = {
-		method: request.method,
-		headers,
-		redirect: 'manual',
-		cache: 'no-store',
-		signal: AbortSignal.any([request.signal, AbortSignal.timeout(30_000)]),
-		duplex: 'half',
-	};
-	if (!['GET', 'HEAD'].includes(request.method)) options.body = request.body;
-
-	let upstream;
-	try {
-		upstream = await fetch(target, options);
-	} catch {
-		return failure(502, 'Marketplace backend is unavailable');
-	}
-
-	const responseHeaders = new Headers();
-	for (const name of [
-		'content-type',
-		'content-disposition',
-		'www-authenticate',
-		'retry-after',
-		'allow',
-	]) {
-		const value = upstream.headers.get(name);
-		if (value) responseHeaders.set(name, value);
-	}
-	// Keep each cookie separate; remove the backend Domain attribute only.
-	for (const cookie of upstream.headers.getSetCookie()) {
-		responseHeaders.append(
-			'Set-Cookie',
-			cookie.replace(/;\s*Domain=[^;]*/gi, ''),
-		);
-	}
-	const location = upstream.headers.get('location');
-	if (location) {
-		const destination = new URL(location, target);
-		responseHeaders.set(
-			'Location',
-			destination.origin === tenant.api.origin
-				? destination.pathname + destination.search + destination.hash
-				: destination.href,
-		);
-	}
-	responseHeaders.set('Cache-Control', 'no-store');
-	responseHeaders.set('Vary', 'Host, X-Forwarded-Host, X-Front-Domain');
-	// fetch decodes compressed bodies: do not reuse upstream Content-Length/Encoding.
-	return new Response(upstream.body, {
-		status: upstream.status,
-		statusText: upstream.statusText,
-		headers: responseHeaders,
-	});
-}
+import { readFile } from 'node:fs/promises';
+import { resolve } from 'node:path';
+import {
+  getDefaultAutoSelectFamilyAttemptTimeout,
+  isIP,
+  setDefaultAutoSelectFamilyAttemptTimeout,
+} from 'node:net';
+
+const environment     = process.env;
+
+// Node gives each resolved backend address 250 ms to connect before it moves
+// on. Over slower links (VPNs, distant regions) every attempt can expire, and
+// the request fails although the backend is reachable. Allow more time per
+// address; a longer value already chosen by the application is kept.
+const connectTimeout  = 2_000;
+if (getDefaultAutoSelectFamilyAttemptTimeout() < connectTimeout) {
+  setDefaultAutoSelectFamilyAttemptTimeout(connectTimeout);
+}
+
+// A backend answer may take up to 30 seconds. A file upload (multipart form:
+// review photos, cart option files, ticket attachments) also has to send the
+// file first; at 3 Mbit/s a 10 MB file alone takes about 30 seconds, so
+// uploads get 5 minutes.
+const requestTimeout  = 30_000;
+const uploadTimeout   = 300_000;
+
+/** @param {Request} request */
+export function marketplaceRequestTimeout(request) {
+  const contentType = request.headers.get('content-type') ?? '';
+
+  return contentType.toLowerCase().startsWith('multipart/form-data')
+    ? uploadTimeout
+    : requestTimeout;
+}
+
+const hostnamePattern =
+  /^(?=.{1,253}$)(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?$/;
+
+// Blog media is served outside /api by the backend's guarded /ps3 routes.
+// Only these read-only paths are forwarded; other /ps3 files stay private.
+const blogMediaPattern =
+  /^\/ps3\/blog\/posts\/(?:images\/\d+|videos\/\d+(?:\/preview)?)$/;
+
+/** @param {string} pathname */
+export function isMarketplaceMediaPath(pathname) {
+  return blogMediaPattern.test(pathname);
+}
+
+/** @param {unknown} value */
+export function normalizeFrontDomain(value) {
+  if (typeof value !== 'string') {
+    return null;
+  }
+  const domain = value.split(',')[0].trim().toLowerCase().replace(/\.$/, '');
+  return hostnamePattern.test(domain) && !isIP(domain) ? domain : null;
+}
+
+/** @param {Request} request @param {string} mimic */
+export function resolveFrontDomain(
+  request,
+  mimic = environment.MIMIC_FRONT_DOMAIN || '',
+) {
+  // The hosting proxy must overwrite these headers. Public hosts win over MIMIC.
+  for (const candidate of [
+    request.headers.get('x-front-domain'),
+    request.headers.get('x-forwarded-host'),
+    request.headers.get('host'),
+    new URL(request.url).hostname,
+  ]) {
+    const domain = normalizeFrontDomain(candidate);
+    if (domain) {
+      return domain;
+    }
+  }
+  return normalizeFrontDomain(mimic);
+}
+
+/** @param {Request} request @param {{mimicFrontDomain?: string}} configuration */
+export async function readMarketplace(request, configuration = {}) {
+  const domain    = resolveFrontDomain(request, configuration.mimicFrontDomain);
+  if (!domain) {
+    throw new Error('Invalid storefront domain');
+  }
+
+  const directory = environment.SITEMAPS_DIR || resolve('sitemaps');
+  const source    = await readFile(resolve(directory, `${domain}.cfg`), 'utf8');
+  const lines     = source
+    .split(/\r?\n/)
+    .map((line) => line.trim())
+    .filter((line) => line && !line.startsWith('#'));
+  if (lines.length !== 1) {
+    throw new Error('Expected one API URL');
+  }
+  const value     = lines[0];
+  const api       = new URL(value.includes('://') ? value : `https://${value}`);
+  api.pathname    = api.pathname.replace(/\/+$/, '');
+  if (
+    api.protocol !== 'https:' ||
+    !hostnamePattern.test(api.hostname) ||
+    !api.hostname.endsWith('.orionplace.app') ||
+    isIP(api.hostname) ||
+    api.port ||
+    api.username ||
+    api.password ||
+    api.search ||
+    api.hash ||
+    api.pathname !== '/api'
+  ) {
+    throw new Error('Expected https://<project>.orionplace.app/api');
+  }
+  return { domain, api };
+}
+
+/** @param {number} status @param {string} message */
+function failure(status, message) {
+  return Response.json(
+    { error: message },
+    {
+      status,
+      headers: {
+        'Cache-Control': 'no-store',
+        'Vary': 'Host, X-Forwarded-Host, X-Front-Domain',
+      },
+    },
+  );
+}
+
+/** @param {Request} request @param {{mimicFrontDomain?: string}} configuration */
+export async function forwardMarketplace(request, configuration = {}) {
+  let tenant;
+  try {
+    tenant = await readMarketplace(request, configuration);
+  } catch {
+    return failure(
+      503,
+      'Storefront domain configuration is missing or invalid',
+    );
+  }
+
+  const incoming        = new URL(request.url);
+  const media           = isMarketplaceMediaPath(incoming.pathname);
+  if (!incoming.pathname.startsWith('/api/') && !media) {
+    return failure(404, 'Unknown API path');
+  }
+  if (media && !['GET', 'HEAD'].includes(request.method)) {
+    return failure(405, 'Media is read-only');
+  }
+  // Prevent encoded separators or traversal from escaping the /api namespace.
+  let path;
+  try {
+    path = decodeURIComponent(incoming.pathname);
+  } catch {
+    return failure(400, 'Invalid API path');
+  }
+  if (
+    path.includes('\\') ||
+    /%(?:2e|2f|5c)/i.test(path) ||
+    path.split('/').some((part) => part === '.' || part === '..')
+  ) {
+    return failure(400, 'Invalid API path');
+  }
+  const target          = new URL(
+    incoming.pathname + incoming.search,
+    tenant.api.origin,
+  );
+  if (
+    media
+      ? !isMarketplaceMediaPath(target.pathname)
+      : !target.pathname.startsWith('/api/')
+  ) {
+    return failure(400, 'Invalid API path');
+  }
+
+  const origin          = request.headers.get('origin');
+  const publicHost      = request.headers.get('host') || incoming.host;
+  const originHosts     = [publicHost, tenant.domain];
+  if (!['GET', 'HEAD', 'OPTIONS'].includes(request.method)) {
+    try {
+      if (
+        request.headers.get('sec-fetch-site') === 'cross-site' ||
+        (origin && !originHosts.includes(new URL(origin).host))
+      ) {
+        return failure(403, 'Cross-site API request rejected');
+      }
+    } catch {
+      return failure(403, 'Invalid Origin');
+    }
+  }
+
+  // An allowlist excludes hop-by-hop and client-supplied routing headers.
+  const headers         = new Headers();
+  for (const name of [
+    'accept',
+    'content-type',
+    'authorization',
+    'cookie',
+    'origin',
+    'referer',
+    'x-csrftoken',
+    'accept-language',
+    'user-agent',
+    'x-tz',
+    'range',
+  ]) {
+    const value = request.headers.get(name);
+    if (value) {
+      headers.set(name, value);
+    }
+  }
+  headers.set('X-Front-Domain', tenant.domain);
+  headers.set('Accept-Encoding', 'identity');
+  const clientIp        =
+    request.headers.get('x-init-ip') ||
+    request.headers.get('x-real-ip') ||
+    request.headers.get('x-forwarded-for')?.split(',')[0]?.trim();
+  if (clientIp) {
+    headers.set('X-Init-Ip', clientIp);
+  }
+  /** @type {RequestInit & { duplex: 'half' }} */
+  const options         = {
+    method: request.method,
+    headers,
+    redirect: 'manual',
+    cache: 'no-store',
+    signal: AbortSignal.any([
+      request.signal,
+      AbortSignal.timeout(marketplaceRequestTimeout(request)),
+    ]),
+    duplex: 'half',
+  };
+  if (!['GET', 'HEAD'].includes(request.method)) {
+    options.body = request.body;
+  }
+
+  let upstream;
+  try {
+    upstream = await fetch(target, options);
+  } catch (error) {
+    // The browser receives only the status; keep the cause in the server log.
+    if (!request.signal.aborted) {
+      const cause = error?.cause?.code ?? error?.message ?? String(error);
+      console.error(`[orionplace] Backend request failed: ${cause}`);
+    }
+    return failure(502, 'Marketplace backend is unavailable');
+  }
+
+  const responseHeaders = new Headers();
+  for (const name of [
+    'content-type',
+    'content-disposition',
+    'www-authenticate',
+    'retry-after',
+    'allow',
+    'accept-ranges',
+    'content-range',
+  ]) {
+    const value = upstream.headers.get(name);
+    if (value) {
+      responseHeaders.set(name, value);
+    }
+  }
+  // Keep each cookie separate; remove the backend Domain attribute only.
+  for (const cookie of upstream.headers.getSetCookie()) {
+    responseHeaders.append(
+      'Set-Cookie',
+      cookie.replace(/;\s*Domain=[^;]*/gi, ''),
+    );
+  }
+  const location        = upstream.headers.get('location');
+  if (location) {
+    const destination = new URL(location, target);
+    responseHeaders.set(
+      'Location',
+      destination.origin === tenant.api.origin
+        ? destination.pathname + destination.search + destination.hash
+        : destination.href,
+    );
+  }
+  responseHeaders.set('Cache-Control', 'no-store');
+  responseHeaders.set('Vary', 'Host, X-Forwarded-Host, X-Front-Domain');
+  // fetch decodes compressed bodies: do not reuse upstream Content-Length/Encoding.
+  return new Response(upstream.body, {
+    status: upstream.status,
+    statusText: upstream.statusText,
+    headers: responseHeaders,
+  });
+}

package/src/asset-loading-plugin.mjs

@@ -0,0 +1,10 @@
+export default function assetLoadingPlugin(nitro) {
+  nitro.hooks.hook('render:html', (html) => {
+    html.head = html.head
+      .map((entry) => entry.replace(
+        /<link\b(?=[^>]*\brel=["']prefetch["'])[^>]*>/gi,
+        '',
+      ))
+      .filter(Boolean);
+  });
+}

package/src/module.mjs

@@ -1,23 +1,50 @@
-import { defineNuxtModule, addServerHandler } from '@nuxt/kit';
+import { defineNuxtModule, addServerHandler, addServerPlugin } from '@nuxt/kit';
 import { existsSync, readdirSync } from 'node:fs';
 import { resolve } from 'node:path';
 import { normalizeFrontDomain } from '../runtime/marketplace.mjs';
+import { appOrigin } from './validation.mjs';
+import tailwindcss from '@tailwindcss/vite';
 
 export default defineNuxtModule({
   meta: { name: 'orionplace-nuxt', configKey: 'orionplace', compatibility: { nuxt: '^4.0.0' } },
   setup(_options, nuxt) {
-    const directory = resolve(nuxt.options.rootDir, 'orionplace/runtime');
+    // Storefront navigation can expose dozens of links at once. Fetch the next
+    // route after the visitor shows intent instead of competing with first paint.
+    nuxt.options.experimental                 ||= {};
+    nuxt.options.experimental.defaults        ||= {};
+    nuxt.options.experimental.defaults.nuxtLink = {
+      ...nuxt.options.experimental.defaults.nuxtLink,
+      prefetchOn: {
+        interaction: true,
+        visibility: false,
+      },
+    };
+    const directory                               = resolve(nuxt.options.rootDir, 'orionplace/runtime');
+    const stylesheet                              = resolve(nuxt.options.rootDir, 'app/assets/css/orionplace.css');
+    // Customer components use Tailwind without changing the host's reset or theme.
+    if (!nuxt.options.css.includes(stylesheet)) nuxt.options.css.push(stylesheet);
+    nuxt.hook('vite:extendConfig', (config) => {
+      config.plugins ||= [];
+      const configured = config.plugins.flat(Infinity).some(plugin => plugin?.name?.startsWith('@tailwindcss/vite:'));
+      if (!configured) config.plugins.push(tailwindcss());
+    });
     // Generated sources live outside server/, so inline them in development too.
-    nuxt.options.nitro.externals ||= {};
-    nuxt.options.nitro.externals.inline ||= [];
+    nuxt.options.nitro.externals                ||= {};
+    nuxt.options.nitro.externals.inline         ||= [];
     nuxt.options.nitro.externals.inline.push(directory);
     if (!existsSync(resolve(directory, 'api.mjs'))) {
       throw new Error('Run npx orionplace-nuxt init to generate the Orionplace integration.');
     }
-    if (nuxt.options.nitro.preset && nuxt.options.nitro.preset !== 'node-server') {
+    // Android app build (see orionplace/README.md): a client-only build whose
+    // API requests go to the public storefront named here, through its gateway.
+    const app                                     = process.env.ORIONPLACE_APP_ORIGIN?.trim()
+      ? appOrigin(process.env.ORIONPLACE_APP_ORIGIN) : '';
+    nuxt.options.runtimeConfig.public.orionplaceAppOrigin = app;
+    if (app) nuxt.options.ssr = false;
+    if (!app && nuxt.options.nitro.preset && nuxt.options.nitro.preset !== 'node-server') {
       throw new Error('Orionplace domain files require the Nitro node-server preset.');
     }
-    const routes = nuxt.options.routeRules;
+    const routes                                  = nuxt.options.routeRules;
     for (const path of ['/api', '/api/**', '/api/*']) {
       if (routes[path]?.proxy || routes[path]?.redirect) {
         throw new Error(`Remove the conflicting ${path} proxy/redirect: Orionplace handles API routing.`);
@@ -27,25 +54,28 @@ export default defineNuxtModule({
       throw new Error('Remove the Vite /api proxy: Orionplace provides a server gateway in development too.');
     }
     // Do not inherit page caching for authenticated API requests.
-    routes['/api/**'] = { ...routes['/api/**'], cache: false, swr: false,
+    routes['/api/**']                             = { ...routes['/api/**'], cache: false, swr: false,
       headers: { ...routes['/api/**']?.headers, 'cache-control': 'no-store' } };
     // MIMIC defaults to empty. The CLI sets .env on the first "add frontend"
     // or an explicit "set mimic"; never infer it from the domain-file directory.
     // Values stay private to the server. MIMIC_FRONT_DOMAIN is also read at runtime.
     nuxt.options.runtimeConfig.mimicFrontDomain ??= '';
-    nuxt.options.runtimeConfig.mimicFrontDomain = process.env.MIMIC_FRONT_DOMAIN
+    nuxt.options.runtimeConfig.mimicFrontDomain   = process.env.MIMIC_FRONT_DOMAIN
       ?? nuxt.options.runtimeConfig.mimicFrontDomain;
-    nuxt.options.nitro.preset ||= 'node-server';
-    const vary = new Set(String(routes['/**']?.headers?.vary || '').split(',').map(x => x.trim()).filter(Boolean));
+    if (!app) nuxt.options.nitro.preset         ||= 'node-server';
+    const vary                                    = new Set(String(routes['/**']?.headers?.vary || '').split(',').map(x => x.trim()).filter(Boolean));
     for (const header of ['Host', 'X-Forwarded-Host', 'X-Front-Domain']) vary.add(header);
-    routes['/**'] = { ...routes['/**'], headers: { ...routes['/**']?.headers, vary: [...vary].join(', ') } };
-    const configs = resolve(nuxt.options.rootDir, process.env.SITEMAPS_DIR || 'sitemaps');
-    const hosts = existsSync(configs) ? readdirSync(configs).filter(x => x.endsWith('.cfg')).map(x => normalizeFrontDomain(x.slice(0, -4))).filter(Boolean) : [];
-    nuxt.options.vite.server ||= {};
+    routes['/**']                                 = { ...routes['/**'], headers: { ...routes['/**']?.headers, vary: [...vary].join(', ') } };
+    const configs                                 = resolve(nuxt.options.rootDir, process.env.SITEMAPS_DIR || 'sitemaps');
+    const hosts                                   = existsSync(configs) ? readdirSync(configs).filter(x => x.endsWith('.cfg')).map(x => normalizeFrontDomain(x.slice(0, -4))).filter(Boolean) : [];
+    nuxt.options.vite.server                    ||= {};
     if (nuxt.options.vite.server.allowedHosts !== true) {
       nuxt.options.vite.server.allowedHosts = [...new Set([...(nuxt.options.vite.server.allowedHosts || []), ...hosts])];
     }
     addServerHandler({ route: '/api/**', handler: resolve(directory, 'api.mjs') });
+    // Guarded blog images and videos; the runtime accepts only those paths.
+    addServerHandler({ route: '/ps3/blog/**', handler: resolve(directory, 'api.mjs') });
     addServerHandler({ middleware: true, handler: resolve(directory, 'domain.mjs') });
+    addServerPlugin(resolve(import.meta.dirname, 'asset-loading-plugin.mjs'));
   },
 });