remote-components 0.0.46 → 0.0.47

package/dist/react/index.js

@@ -95,6 +95,9 @@ function logDebug(location2, message) {
     console.debug(`[${PREFIX}:${location2}]: ${message}`);
   }
 }
+function logInfo(location2, message) {
+  console.info(`[${PREFIX}:${location2}]: ${message}`);
+}
 function logWarn(location2, message) {
   console.warn(`[${PREFIX}:${location2}]: ${message}`);
 }
@@ -106,18 +109,6 @@ function logError(location2, message, cause) {
   );
 }
 
-// src/shared/utils/index.ts
-function escapeString(str) {
-  return str.replace(/[^a-z0-9]/g, "_");
-}
-var attrToProp = {
-  fetchpriority: "fetchPriority",
-  crossorigin: "crossOrigin",
-  imagesrcset: "imageSrcSet",
-  imagesizes: "imageSizes",
-  srcset: "srcSet"
-};
-
 // src/shared/client/polyfill.tsx
 import { jsx } from "react/jsx-runtime";
 function applyBundleUrlToSrc(bundle, src) {
@@ -589,6 +580,46 @@ async function loadScripts(scripts) {
   );
 }
 
+// src/shared/ssr/fetch-with-protected-rc-fallback.ts
+var RC_PROTECTED_REMOTE_FETCH_PATHNAME = "/rc-fetch-protected-remote";
+async function fetchWithProtectedRcFallback(url, init) {
+  try {
+    const res = await fetch(url, init);
+    return res;
+  } catch (error) {
+    if (typeof document === "object" && typeof document.location === "object" && document.location.origin !== new URL(url).origin) {
+      logInfo(
+        "FetchRemoteComponent",
+        "Request failed due to CORS, attempting to fetch it via the withRemoteComponentsHost proxy."
+      );
+      const proxiedRes = await fetch(
+        `${RC_PROTECTED_REMOTE_FETCH_PATHNAME}?url=${url}`
+      );
+      if (proxiedRes.status === 200) {
+        return proxiedRes;
+      } else {
+        logError(
+          "FetchRemoteComponent",
+          `Could not proxy remote: [response status ${proxiedRes.status}] ${await proxiedRes.text()}`
+        );
+      }
+    }
+    throw error;
+  }
+}
+
+// src/shared/utils/index.ts
+function escapeString(str) {
+  return str.replace(/[^a-z0-9]/g, "_");
+}
+var attrToProp = {
+  fetchpriority: "fetchPriority",
+  crossorigin: "crossOrigin",
+  imagesrcset: "imageSrcSet",
+  imagesizes: "imageSizes",
+  srcset: "srcSet"
+};
+
 // src/shared/client/const.ts
 var DEFAULT_ROUTE = "/";
 var RUNTIME_WEBPACK = "webpack";
@@ -642,7 +673,7 @@ function createChunkLoader(runtime) {
     }
     logDebug("ChunkLoader", `Fetching chunk from: "${url}"`);
     self.__remote_components_turbopack_chunk_loader_promise__[url] = new Promise((resolve, reject) => {
-      fetch(url).then((res) => res.text()).then((code) => {
+      fetchWithProtectedRcFallback(url).then((res) => res.text()).then((code) => {
         const hasTurbopack = code.includes("globalThis.TURBOPACK") || code.includes("self.TURBOPACK");
         if (hasTurbopack) {
           return handleTurbopackChunk(code, bundle ?? "", url);
@@ -1540,11 +1571,16 @@ function remoteFetchHeaders() {
 }
 
 // src/shared/ssr/fetch-with-hooks.ts
-async function fetchWithHooks(url, init, options = {}) {
+async function fetchWithHooks(url, additionalInit, options = {}) {
   const { onRequest, onResponse } = options;
+  const init = {
+    method: "GET",
+    headers: remoteFetchHeaders(),
+    ...additionalInit
+  };
   let res = await onRequest?.(url, init);
   if (!res) {
-    res = await fetch(url, init);
+    res = await fetchWithProtectedRcFallback(url, init);
   }
   const transformedRes = await onResponse?.(url, res);
   if (transformedRes) {
@@ -1753,8 +1789,6 @@ function RemoteComponent({
           );
           if (!html && src) {
             const fetchInit = {
-              method: "GET",
-              headers: remoteFetchHeaders(),
               credentials
             };
             const res = await fetchWithHooks(url, fetchInit, {