remote-components 0.0.46 → 0.0.47

package/dist/html/host.cjs

@@ -62,6 +62,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}`);
 }
@@ -267,6 +270,41 @@ var init_shared_modules = __esm({
   }
 });
 
+// src/shared/ssr/fetch-with-protected-rc-fallback.ts
+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;
+  }
+}
+var RC_PROTECTED_REMOTE_FETCH_PATHNAME;
+var init_fetch_with_protected_rc_fallback = __esm({
+  "src/shared/ssr/fetch-with-protected-rc-fallback.ts"() {
+    "use strict";
+    init_logger();
+    RC_PROTECTED_REMOTE_FETCH_PATHNAME = "/rc-fetch-protected-remote";
+  }
+});
+
 // src/shared/utils/index.ts
 function escapeString(str) {
   return str.replace(/[^a-z0-9]/g, "_");
@@ -274,7 +312,6 @@ function escapeString(str) {
 var init_utils = __esm({
   "src/shared/utils/index.ts"() {
     "use strict";
-    init_logger();
   }
 });
 
@@ -336,7 +373,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);
@@ -489,6 +526,7 @@ var init_chunk_loader = __esm({
   "src/shared/client/chunk-loader.ts"() {
     "use strict";
     init_error();
+    init_fetch_with_protected_rc_fallback();
     init_logger();
     init_const();
   }
@@ -1258,7 +1296,7 @@ var import_jsx_runtime, imageImpl;
 var init_polyfill = __esm({
   "src/shared/client/polyfill.tsx"() {
     "use strict";
-    init_utils();
+    init_logger();
     // eslint-disable-next-line @next/next/no-img-element, jsx-a11y/alt-text
     import_jsx_runtime = require("react/jsx-runtime");
     imageImpl = (bundle) => function RemoteImage({
@@ -1663,11 +1701,17 @@ function remoteFetchHeaders() {
 }
 
 // src/shared/ssr/fetch-with-hooks.ts
-async function fetchWithHooks(url, init, options = {}) {
+init_fetch_with_protected_rc_fallback();
+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) {
@@ -1678,6 +1722,7 @@ async function fetchWithHooks(url, init, options = {}) {
 
 // src/html/host/index.tsx
 init_utils();
+init_logger();
 
 // src/html/host/runtime/index.ts
 init_error();
@@ -1819,8 +1864,6 @@ if (typeof HTMLElement !== "undefined") {
       }
       if (!remoteComponentChild && url) {
         const fetchInit = {
-          method: "GET",
-          headers: remoteFetchHeaders(),
           credentials: this.getAttribute("credentials") || "same-origin"
         };
         const res = await fetchWithHooks(url, fetchInit, {