@nuxt/scripts 1.0.0-beta.21 → 1.0.0-beta.22

package/dist/runtime/registry/schemas.js

@@ -1,4 +1,21 @@
 import { any, array, boolean, custom, literal, minLength, number, object, optional, pipe, record, string, union } from "#nuxt-scripts-validator";
+export const BlueskyEmbedOptions = object({
+  /**
+   * The Bluesky post URL to embed.
+   * @example 'https://bsky.app/profile/bsky.app/post/3mgnwwvj3u22a'
+   */
+  postUrl: string(),
+  /**
+   * Custom API endpoint for fetching post data.
+   * @default '/_scripts/embed/bluesky'
+   */
+  apiEndpoint: optional(string()),
+  /**
+   * Custom image proxy endpoint.
+   * @default '/_scripts/embed/bluesky-image'
+   */
+  imageProxyEndpoint: optional(string())
+});
 export const ClarityOptions = object({
   /**
    * The Clarity token.
@@ -428,7 +445,7 @@ export const InstagramEmbedOptions = object({
   captions: optional(boolean()),
   /**
    * Custom API endpoint for fetching embed HTML.
-   * @default '/api/_scripts/instagram-embed'
+   * @default '/_scripts/embed/instagram'
    */
   apiEndpoint: optional(string())
 });
@@ -826,12 +843,12 @@ export const XEmbedOptions = object({
   tweetId: string(),
   /**
    * Optional: Custom API endpoint for fetching tweet data.
-   * @default '/api/_scripts/x-embed'
+   * @default '/_scripts/embed/x'
    */
   apiEndpoint: optional(string()),
   /**
    * Optional: Custom image proxy endpoint.
-   * @default '/api/_scripts/x-embed-image'
+   * @default '/_scripts/embed/x-image'
    */
   imageProxyEndpoint: optional(string())
 });

package/dist/runtime/registry/x-embed.js

@@ -1,6 +1,6 @@
 import { XEmbedOptions } from "./schemas.js";
 export { XEmbedOptions };
-export function proxyXImageUrl(url, proxyEndpoint = "/api/_scripts/x-embed-image") {
+export function proxyXImageUrl(url, proxyEndpoint = "/_scripts/embed/x-image") {
   const separator = proxyEndpoint.includes("?") ? "&" : "?";
   return `${proxyEndpoint}${separator}url=${encodeURIComponent(url)}`;
 }

package/dist/runtime/server/bluesky-embed-image.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<any>>;
+export default _default;

package/dist/runtime/server/bluesky-embed-image.js

@@ -0,0 +1,7 @@
+import { createImageProxyHandler } from "./utils/image-proxy.js";
+export default createImageProxyHandler({
+  allowedDomains: [
+    "cdn.bsky.app",
+    "av-cdn.bsky.app"
+  ]
+});

package/dist/runtime/server/bluesky-embed.d.ts

@@ -0,0 +1,16 @@
+declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<{
+    uri: string;
+    cid: string;
+    author: Record<string, any>;
+    record: Record<string, any>;
+    embed?: Record<string, any>;
+    likeCount: number;
+    repostCount: number;
+    replyCount: number;
+    quoteCount: number;
+    indexedAt: string;
+    labels: Array<{
+        val: string;
+    }>;
+}>>;
+export default _default;

package/dist/runtime/server/bluesky-embed.js

@@ -0,0 +1,59 @@
+import { createError, defineEventHandler, getQuery, setHeader } from "h3";
+import { $fetch } from "ofetch";
+const BSKY_POST_URL_RE = /^https:\/\/bsky\.app\/profile\/([^/]+)\/post\/([^/?]+)$/;
+export default defineEventHandler(async (event) => {
+  const query = getQuery(event);
+  const postUrl = query.url;
+  if (!postUrl) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: "Post URL is required"
+    });
+  }
+  const match = postUrl.match(BSKY_POST_URL_RE);
+  if (!match) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: "Invalid Bluesky post URL"
+    });
+  }
+  const [, actor, rkey] = match;
+  let did = actor;
+  if (!actor.startsWith("did:")) {
+    const profile = await $fetch(
+      `https://public.api.bsky.app/xrpc/app.bsky.actor.getProfile?actor=${encodeURIComponent(actor)}`
+    ).catch((error) => {
+      throw createError({
+        statusCode: error.statusCode || 500,
+        statusMessage: "Failed to resolve Bluesky handle"
+      });
+    });
+    did = profile.did;
+  }
+  const uri = `at://${did}/app.bsky.feed.post/${rkey}`;
+  const response = await $fetch(
+    `https://public.api.bsky.app/xrpc/app.bsky.feed.getPostThread?uri=${encodeURIComponent(uri)}&depth=0&parentHeight=0`
+  ).catch((error) => {
+    throw createError({
+      statusCode: error.statusCode || 500,
+      statusMessage: error.statusMessage || "Failed to fetch Bluesky post"
+    });
+  });
+  if (response.thread.$type !== "app.bsky.feed.defs#threadViewPost") {
+    throw createError({
+      statusCode: 404,
+      statusMessage: "Post not found"
+    });
+  }
+  const post = response.thread.post;
+  const hasOptOut = post.labels?.some((l) => l.val === "!no-unauthenticated") || post.author?.labels?.some((l) => l.val === "!no-unauthenticated");
+  if (hasOptOut) {
+    throw createError({
+      statusCode: 403,
+      statusMessage: "Author has opted out of external embedding"
+    });
+  }
+  setHeader(event, "Content-Type", "application/json");
+  setHeader(event, "Cache-Control", "public, max-age=600, s-maxage=600");
+  return post;
+});

package/dist/runtime/server/google-maps-geocode-proxy.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<any>>;
+export default _default;

package/dist/runtime/server/google-maps-geocode-proxy.js

@@ -0,0 +1,34 @@
+import { useRuntimeConfig } from "#imports";
+import { createError, defineEventHandler, getQuery, setHeader } from "h3";
+import { $fetch } from "ofetch";
+import { withQuery } from "ufo";
+export default defineEventHandler(async (event) => {
+  const runtimeConfig = useRuntimeConfig();
+  const privateConfig = runtimeConfig["nuxt-scripts"]?.googleMapsGeocodeProxy;
+  const apiKey = privateConfig?.apiKey;
+  if (!apiKey) {
+    throw createError({
+      statusCode: 500,
+      statusMessage: "Google Maps API key not configured for geocode proxy"
+    });
+  }
+  const query = getQuery(event);
+  const { key: _clientKey, ...safeQuery } = query;
+  const geocodeUrl = withQuery("https://maps.googleapis.com/maps/api/geocode/json", {
+    ...safeQuery,
+    key: apiKey
+  });
+  const data = await $fetch(geocodeUrl, {
+    headers: {
+      "User-Agent": "Nuxt Scripts Google Geocode Proxy"
+    }
+  }).catch((error) => {
+    throw createError({
+      statusCode: error.statusCode || 500,
+      statusMessage: error.statusMessage || "Failed to geocode"
+    });
+  });
+  setHeader(event, "Content-Type", "application/json");
+  setHeader(event, "Cache-Control", "public, max-age=86400, s-maxage=86400");
+  return data;
+});

package/dist/runtime/server/google-static-maps-proxy.js

@@ -1,5 +1,5 @@
 import { useRuntimeConfig } from "#imports";
-import { createError, defineEventHandler, getHeader, getQuery, setHeader } from "h3";
+import { createError, defineEventHandler, getQuery, setHeader } from "h3";
 import { $fetch } from "ofetch";
 import { withQuery } from "ufo";
 export default defineEventHandler(async (event) => {
@@ -19,17 +19,6 @@ export default defineEventHandler(async (event) => {
       statusMessage: "Google Maps API key not configured for proxy"
     });
   }
-  const referer = getHeader(event, "referer");
-  const host = getHeader(event, "host");
-  if (referer && host) {
-    const refererUrl = new URL(referer).host;
-    if (refererUrl !== host) {
-      throw createError({
-        statusCode: 403,
-        statusMessage: "Invalid referer"
-      });
-    }
-  }
   const query = getQuery(event);
   const { key: _clientKey, ...safeQuery } = query;
   const googleMapsUrl = withQuery("https://maps.googleapis.com/maps/api/staticmap", {

package/dist/runtime/server/gravatar-proxy.js

@@ -1,25 +1,10 @@
 import { useRuntimeConfig } from "#imports";
-import { createError, defineEventHandler, getHeader, getQuery, setHeader } from "h3";
+import { createError, defineEventHandler, getQuery, setHeader } from "h3";
 import { $fetch } from "ofetch";
 import { withQuery } from "ufo";
 export default defineEventHandler(async (event) => {
   const runtimeConfig = useRuntimeConfig();
   const proxyConfig = runtimeConfig.public["nuxt-scripts"]?.gravatarProxy;
-  const referer = getHeader(event, "referer");
-  const host = getHeader(event, "host");
-  if (referer && host) {
-    let refererHost;
-    try {
-      refererHost = new URL(referer).host;
-    } catch {
-    }
-    if (refererHost && refererHost !== host) {
-      throw createError({
-        statusCode: 403,
-        statusMessage: "Invalid referer"
-      });
-    }
-  }
   const query = getQuery(event);
   let hash = query.hash;
   const email = query.email;

package/dist/runtime/server/instagram-embed-asset.js

@@ -1,43 +1,9 @@
-import { createError, defineEventHandler, getQuery, setHeader } from "h3";
-import { $fetch } from "ofetch";
-const AMP_RE = /&/g;
-export default defineEventHandler(async (event) => {
-  const query = getQuery(event);
-  const url = query.url?.replace(AMP_RE, "&");
-  if (!url) {
-    throw createError({
-      statusCode: 400,
-      statusMessage: "Asset URL is required"
-    });
-  }
-  let parsedUrl;
-  try {
-    parsedUrl = new URL(url);
-  } catch {
-    throw createError({
-      statusCode: 400,
-      statusMessage: "Invalid asset URL"
-    });
-  }
-  if (parsedUrl.hostname !== "static.cdninstagram.com") {
-    throw createError({
-      statusCode: 403,
-      statusMessage: "Domain not allowed"
-    });
-  }
-  const response = await $fetch.raw(url, {
-    headers: {
-      "Accept": "*/*",
-      "User-Agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36"
-    }
-  }).catch((error) => {
-    throw createError({
-      statusCode: error.statusCode || 500,
-      statusMessage: error.statusMessage || "Failed to fetch asset"
-    });
-  });
-  const contentType = response.headers.get("content-type") || "application/octet-stream";
-  setHeader(event, "Content-Type", contentType);
-  setHeader(event, "Cache-Control", "public, max-age=86400, s-maxage=86400");
-  return response._data;
+import { createImageProxyHandler } from "./utils/image-proxy.js";
+export default createImageProxyHandler({
+  allowedDomains: ["static.cdninstagram.com"],
+  accept: "*/*",
+  userAgent: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36",
+  cacheMaxAge: 86400,
+  contentType: "application/octet-stream",
+  decodeAmpersands: true
 });

package/dist/runtime/server/instagram-embed-image.js

@@ -1,55 +1,7 @@
-import { createError, defineEventHandler, getQuery, setHeader } from "h3";
-import { $fetch } from "ofetch";
-const AMP_RE = /&/g;
-export default defineEventHandler(async (event) => {
-  const query = getQuery(event);
-  const url = query.url?.replace(AMP_RE, "&");
-  if (!url) {
-    throw createError({
-      statusCode: 400,
-      statusMessage: "Image URL is required"
-    });
-  }
-  let parsedUrl;
-  try {
-    parsedUrl = new URL(url);
-  } catch {
-    throw createError({
-      statusCode: 400,
-      statusMessage: "Invalid image URL"
-    });
-  }
-  if (parsedUrl.protocol !== "http:" && parsedUrl.protocol !== "https:") {
-    throw createError({
-      statusCode: 400,
-      statusMessage: "Invalid URL scheme"
-    });
-  }
-  if (!parsedUrl.hostname.endsWith(".cdninstagram.com") && parsedUrl.hostname !== "scontent.cdninstagram.com") {
-    throw createError({
-      statusCode: 403,
-      statusMessage: "Domain not allowed"
-    });
-  }
-  const response = await $fetch.raw(url, {
-    redirect: "manual",
-    headers: {
-      "Accept": "image/webp,image/jpeg,image/png,image/*,*/*;q=0.8",
-      "User-Agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36"
-    }
-  }).catch((error) => {
-    throw createError({
-      statusCode: error.statusCode || 500,
-      statusMessage: error.statusMessage || "Failed to fetch image"
-    });
-  });
-  if (response.status >= 300 && response.status < 400) {
-    throw createError({
-      statusCode: 403,
-      statusMessage: "Redirects not allowed"
-    });
-  }
-  setHeader(event, "Content-Type", response.headers.get("content-type") || "image/jpeg");
-  setHeader(event, "Cache-Control", "public, max-age=3600, s-maxage=3600");
-  return response._data;
+import { createImageProxyHandler } from "./utils/image-proxy.js";
+export default createImageProxyHandler({
+  allowedDomains: (hostname) => hostname.endsWith(".cdninstagram.com") || hostname === "scontent.cdninstagram.com",
+  userAgent: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36",
+  followRedirects: false,
+  decodeAmpersands: true
 });

package/dist/runtime/server/instagram-embed.d.ts

@@ -1,2 +1,18 @@
+export declare const RSRC_RE: RegExp;
+export declare const AMP_RE: RegExp;
+export declare const SCONTENT_RE: RegExp;
+export declare const STATIC_CDN_RE: RegExp;
+export declare const LOOKASIDE_RE: RegExp;
+export declare const INSTAGRAM_IMAGE_HOSTS: string[];
+export declare const INSTAGRAM_ASSET_HOST = "static.cdninstagram.com";
+export declare function proxyImageUrl(url: string): string;
+export declare function proxyAssetUrl(url: string): string;
+export declare function rewriteUrl(url: string): string;
+export declare function rewriteUrlsInText(text: string): string;
+/**
+ * Scope CSS rules under a parent selector and strip global/page-level rules.
+ * Removes :root, html, body selectors and @charset/@import at-rules.
+ */
+export declare function scopeCss(css: string, scopeSelector: string): string;
 declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<string>>;
 export default _default;

package/dist/runtime/server/instagram-embed.js

@@ -1,16 +1,128 @@
 import { createError, defineEventHandler, getQuery, setHeader } from "h3";
 import { $fetch } from "ofetch";
-const LINK_RE = /<link[^>]+rel=["']stylesheet["'][^>]+href=["']([^"']+)["'][^>]*>/gi;
-const LINK_RE_2 = /<link[^>]+href=["']([^"']+)["'][^>]+rel=["']stylesheet["'][^>]*>/gi;
-const RSRC_RE = /url\(\/rsrc\.php([^)]+)\)/g;
-const SCRIPT_RE = /<script[\s\S]*?<\/script>/gi;
-const STYLESHEET_RE = /<link[^>]+rel=["']stylesheet["'][^>]*>/gi;
-const CSS_RE = /<link[^>]+href=["'][^"']+\.css[^"']*["'][^>]*>/gi;
-const NOSCRIPT_RE = /<noscript>[\s\S]*?<\/noscript>/gi;
-const SCONTENT_RE = /https:\/\/scontent[^"'\s),]+\.cdninstagram\.com[^"'\s),]+/g;
-const STATIC_CDN_RE = /https:\/\/static\.cdninstagram\.com[^"'\s),]+/g;
-const LOOKASIDE_RE = /https:\/\/lookaside\.instagram\.com[^"'\s),]+/g;
-const AMP_RE = /&amp;/g;
+import { ELEMENT_NODE, parse, renderSync, TEXT_NODE, walkSync } from "ultrahtml";
+export const RSRC_RE = /url\(\/rsrc\.php([^)]+)\)/g;
+export const AMP_RE = /&amp;/g;
+export const SCONTENT_RE = /https:\/\/scontent[^"'\s),]+\.cdninstagram\.com[^"'\s),]+/g;
+export const STATIC_CDN_RE = /https:\/\/static\.cdninstagram\.com[^"'\s),]+/g;
+export const LOOKASIDE_RE = /https:\/\/lookaside\.instagram\.com[^"'\s),]+/g;
+export const INSTAGRAM_IMAGE_HOSTS = ["scontent.cdninstagram.com", "lookaside.instagram.com"];
+export const INSTAGRAM_ASSET_HOST = "static.cdninstagram.com";
+const CHARSET_RE = /@charset\s[^;]+;/gi;
+const IMPORT_RE = /@import\s[^;]+;/gi;
+const WHITESPACE_RE = /\s/;
+const AT_RULE_NAME_RE = /@([\w-]+)/;
+const MULTI_SPACE_RE = /\s+/g;
+const SRCSET_SPLIT_RE = /\s+/;
+export function proxyImageUrl(url) {
+  return `/_scripts/embed/instagram-image?url=${encodeURIComponent(url.replace(AMP_RE, "&"))}`;
+}
+export function proxyAssetUrl(url) {
+  return `/_scripts/embed/instagram-asset?url=${encodeURIComponent(url.replace(AMP_RE, "&"))}`;
+}
+export function rewriteUrl(url) {
+  try {
+    const parsed = new URL(url);
+    if (parsed.hostname === INSTAGRAM_ASSET_HOST)
+      return proxyAssetUrl(url);
+    if (INSTAGRAM_IMAGE_HOSTS.some((h) => parsed.hostname === h || parsed.hostname.endsWith(`.cdninstagram.com`)))
+      return proxyImageUrl(url);
+  } catch {
+  }
+  return url;
+}
+export function rewriteUrlsInText(text) {
+  return text.replace(SCONTENT_RE, (m) => proxyImageUrl(m)).replace(STATIC_CDN_RE, (m) => proxyAssetUrl(m)).replace(LOOKASIDE_RE, (m) => proxyImageUrl(m));
+}
+function removeNode(node) {
+  node.type = TEXT_NODE;
+  node.value = "";
+  node.name = void 0;
+  node.attributes = {};
+  node.children = [];
+}
+export function scopeCss(css, scopeSelector) {
+  let result = css.replace(CHARSET_RE, "");
+  result = result.replace(IMPORT_RE, "");
+  return processRules(result, scopeSelector);
+}
+function processRules(css, scopeSelector) {
+  const output = [];
+  let i = 0;
+  while (i < css.length) {
+    while (i < css.length && WHITESPACE_RE.test(css[i])) i++;
+    if (i >= css.length)
+      break;
+    if (css[i] === "@") {
+      const atRule = extractAtRule(css, i);
+      if (atRule) {
+        const atName = atRule.content.match(AT_RULE_NAME_RE)?.[1]?.toLowerCase();
+        if (atName === "media" || atName === "supports" || atName === "layer") {
+          const braceStart = atRule.content.indexOf("{");
+          const innerCss = atRule.content.slice(braceStart + 1, -1);
+          const scopedInner = processRules(innerCss, scopeSelector);
+          output.push(`${atRule.content.slice(0, braceStart + 1) + scopedInner}}`);
+        } else if (atName === "keyframes" || atName === "-webkit-keyframes" || atName === "font-face") {
+          output.push(atRule.content);
+        }
+        i = atRule.end;
+        continue;
+      }
+    }
+    const bracePos = css.indexOf("{", i);
+    if (bracePos === -1)
+      break;
+    const selector = css.slice(i, bracePos).trim();
+    const block = extractBlock(css, bracePos);
+    if (!block)
+      break;
+    i = block.end;
+    if (!selector)
+      continue;
+    const selectors = selector.split(",").map((s) => s.trim());
+    const filteredSelectors = selectors.filter((s) => {
+      const normalized = s.replace(MULTI_SPACE_RE, " ").trim().toLowerCase();
+      return normalized !== ":root" && normalized !== "html" && normalized !== "body" && !normalized.startsWith(":root ") && !normalized.startsWith("html ") && !normalized.startsWith("body ") && normalized !== "html, body";
+    });
+    if (filteredSelectors.length === 0)
+      continue;
+    const scopedSelectors = filteredSelectors.map((s) => {
+      return `${scopeSelector} ${s}`;
+    });
+    output.push(`${scopedSelectors.join(", ")} ${block.content}`);
+  }
+  return output.join("\n");
+}
+function extractAtRule(css, start) {
+  const bracePos = css.indexOf("{", start);
+  const semiPos = css.indexOf(";", start);
+  if (semiPos !== -1 && (bracePos === -1 || semiPos < bracePos)) {
+    return { content: css.slice(start, semiPos + 1), end: semiPos + 1 };
+  }
+  if (bracePos === -1)
+    return null;
+  const block = extractBlock(css, bracePos);
+  if (!block)
+    return null;
+  return {
+    content: css.slice(start, bracePos) + block.content,
+    end: block.end
+  };
+}
+function extractBlock(css, openBrace) {
+  let depth = 0;
+  for (let j = openBrace; j < css.length; j++) {
+    if (css[j] === "{") {
+      depth++;
+    } else if (css[j] === "}") {
+      depth--;
+      if (depth === 0) {
+        return { content: css.slice(openBrace, j + 1), end: j + 1 };
+      }
+    }
+  }
+  return null;
+}
 export default defineEventHandler(async (event) => {
   const query = getQuery(event);
   const postUrl = query.url;
@@ -42,7 +154,6 @@ export default defineEventHandler(async (event) => {
   const html = await $fetch(embedUrl, {
     headers: {
       "Accept": "text/html",
-      // Use simple UA - full Chrome UA triggers JS-heavy version without static content
       "User-Agent": "Mozilla/5.0 (compatible; Googlebot/2.1; +http://www.google.com/bot.html)"
     }
   }).catch((error) => {
@@ -51,16 +162,45 @@ export default defineEventHandler(async (event) => {
       statusMessage: error.statusMessage || "Failed to fetch Instagram embed"
     });
   });
+  const ast = parse(html);
   const cssUrls = [];
-  let match;
-  while ((match = LINK_RE.exec(html)) !== null) {
-    if (match[1])
-      cssUrls.push(match[1]);
-  }
-  while ((match = LINK_RE_2.exec(html)) !== null) {
-    if (match[1])
-      cssUrls.push(match[1]);
-  }
+  walkSync(ast, (node) => {
+    if (node.type !== ELEMENT_NODE)
+      return;
+    if (node.name === "link" && node.attributes.rel === "stylesheet" && node.attributes.href) {
+      cssUrls.push(node.attributes.href);
+      removeNode(node);
+      return;
+    }
+    if (node.name === "script" || node.name === "noscript" || node.name === "style") {
+      removeNode(node);
+      return;
+    }
+    for (const attr of ["src", "poster"]) {
+      if (node.attributes[attr])
+        node.attributes[attr] = rewriteUrl(node.attributes[attr]);
+    }
+    if (node.attributes.srcset) {
+      node.attributes.srcset = node.attributes.srcset.split(",").map((entry) => {
+        const parts = entry.trim().split(SRCSET_SPLIT_RE);
+        const url = parts[0];
+        const descriptor = parts.slice(1).join(" ");
+        return url ? `${rewriteUrl(url)}${descriptor ? ` ${descriptor}` : ""}` : entry;
+      }).join(", ");
+    }
+    if (node.attributes.style)
+      node.attributes.style = rewriteUrlsInText(node.attributes.style);
+  });
+  walkSync(ast, (node) => {
+    if (node.type === TEXT_NODE && node.value)
+      node.value = rewriteUrlsInText(node.value);
+  });
+  let bodyNode = null;
+  walkSync(ast, (node) => {
+    if (node.type === ELEMENT_NODE && node.name === "body")
+      bodyNode = node;
+  });
+  const bodyHtml = bodyNode ? bodyNode.children.map((child) => renderSync(child)).join("") : renderSync(ast);
   const cssContents = await Promise.all(
     cssUrls.map(
       (url) => $fetch(url, {
@@ -71,30 +211,19 @@ export default defineEventHandler(async (event) => {
   let combinedCss = cssContents.join("\n");
   combinedCss = combinedCss.replace(
     RSRC_RE,
-    (_m, path) => `url(/api/_scripts/instagram-embed-asset?url=${encodeURIComponent(`https://static.cdninstagram.com/rsrc.php${path}`)})`
+    (_m, path) => `url(/_scripts/embed/instagram-asset?url=${encodeURIComponent(`https://static.cdninstagram.com/rsrc.php${path}`)})`
   );
+  combinedCss = rewriteUrlsInText(combinedCss);
+  combinedCss = scopeCss(combinedCss, ".instagram-embed-root");
   const baseStyles = `
-    html { background: white; max-width: 540px; width: calc(100% - 2px); border-radius: 3px; border: 1px solid rgb(219, 219, 219); display: block; margin: 0px 0px 12px; min-width: 326px; padding: 0px; }
-    #splash-screen { display: none !important; }
-    .Embed { opacity: 1 !important; visibility: visible !important; }
-    .EmbeddedMedia, .EmbeddedMediaImage { display: block !important; visibility: visible !important; }
+    .instagram-embed-root { background: white; max-width: 540px; width: calc(100% - 2px); border-radius: 3px; border: 1px solid rgb(219, 219, 219); display: block; margin: 0px 0px 12px; min-width: 326px; padding: 0px; }
+    .instagram-embed-root #splash-screen { display: none !important; }
+    .instagram-embed-root .Embed { opacity: 1 !important; visibility: visible !important; }
+    .instagram-embed-root .EmbeddedMedia, .instagram-embed-root .EmbeddedMediaImage { display: block !important; visibility: visible !important; }
   `;
-  let rewrittenHtml = html.replace(SCRIPT_RE, "").replace(STYLESHEET_RE, "").replace(CSS_RE, "").replace(NOSCRIPT_RE, "").replace(
-    SCONTENT_RE,
-    (m) => `/api/_scripts/instagram-embed-image?url=${encodeURIComponent(m.replace(AMP_RE, "&"))}`
-  ).replace(
-    STATIC_CDN_RE,
-    (m) => `/api/_scripts/instagram-embed-asset?url=${encodeURIComponent(m.replace(AMP_RE, "&"))}`
-  ).replace(
-    LOOKASIDE_RE,
-    (m) => `/api/_scripts/instagram-embed-image?url=${encodeURIComponent(m.replace(AMP_RE, "&"))}`
-  );
-  rewrittenHtml = rewrittenHtml.replace(
-    "</head>",
-    `<style>${baseStyles}
-${combinedCss}</style></head>`
-  );
+  const result = `<div class="instagram-embed-root"><style>${baseStyles}
+${combinedCss}</style>${bodyHtml}</div>`;
   setHeader(event, "Content-Type", "text/html");
   setHeader(event, "Cache-Control", "public, max-age=600, s-maxage=600");
-  return rewrittenHtml;
+  return result;
 });

package/dist/runtime/server/utils/image-proxy.d.ts

@@ -0,0 +1,12 @@
+export interface ImageProxyConfig {
+    allowedDomains: string[] | ((hostname: string) => boolean);
+    accept?: string;
+    userAgent?: string;
+    cacheMaxAge?: number;
+    contentType?: string;
+    /** Follow redirects (default: true). Set to false to reject redirects (SSRF protection). */
+    followRedirects?: boolean;
+    /** Decode & in URL query parameter */
+    decodeAmpersands?: boolean;
+}
+export declare function createImageProxyHandler(config: ImageProxyConfig): import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<any>>;