@apps-in-toss/framework 1.4.5 → 1.4.6

package/dist/index.cjs

@@ -1594,25 +1594,20 @@ function useBridgeHandler({
   onMessage,
   constantHandlerMap,
   asyncHandlerMap,
-  eventListenerMap,
-  injectedJavaScript: originalInjectedJavaScript
+  eventListenerMap
 }) {
   const ref = (0, import_react23.useRef)(null);
   const injectedJavaScript = (0, import_react23.useMemo)(
-    () => [
-      `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
-        Object.entries(constantHandlerMap).reduce(
-          (acc, [key, value]) => {
-            acc[key] = typeof value === "function" ? value() : value;
-            return acc;
-          },
-          {}
-        )
-      )};`,
-      originalInjectedJavaScript,
-      "true"
-    ].join("\n"),
-    [constantHandlerMap, originalInjectedJavaScript]
+    () => `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
+      Object.entries(constantHandlerMap).reduce(
+        (acc, [key, value]) => {
+          acc[key] = typeof value === "function" ? value() : value;
+          return acc;
+        },
+        {}
+      )
+    )};`,
+    [constantHandlerMap]
   );
   const createHandleOnEvent = (functionName, eventId) => (response) => {
     ref.current?.injectJavaScript(`
@@ -1628,7 +1623,7 @@ function useBridgeHandler({
   const $onMessage = (0, import_react23.useCallback)(
     async (e) => {
       onMessage?.(e);
-      const data = JSON.parse(e.nativeEvent.data);
+      const data = parseNativeEventData(e.nativeEvent.data);
       if (typeof data !== "object" || data === null || typeof data.functionName !== "string" || typeof data.eventId !== "string" || typeof data.type !== "string" || !["addEventListener", "removeEventListener", "method"].includes(data.type)) {
         return;
       }
@@ -1674,6 +1669,14 @@ function useBridgeHandler({
     onMessage: $onMessage
   };
 }
+function parseNativeEventData(data) {
+  try {
+    return JSON.parse(data);
+  } catch (error) {
+    console.error(error);
+    return null;
+  }
+}
 
 // src/core/hooks/useWebBackHandler.tsx
 var import_react_native27 = require("@granite-js/react-native");
@@ -2134,19 +2137,11 @@ function WebView({ type, local, onMessage, ...props }) {
   const bottom = (0, import_private9.useSafeAreaBottom)();
   const global2 = getAppsInTossGlobals();
   const navigationBarContext = useNavigationBarContext();
-  const disableTextSelectionCSS = `
-    (function() {
-      const style = document.createElement('style');
-      style.textContent = '*:not(input):not(textarea) { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }';
-      document.head.appendChild(style);
-    })();
-  `;
   const [allowsBackForwardNavigationGestures, setAllowsBackForwardNavigationGestures] = (0, import_react28.useState)(
     props.allowsBackForwardNavigationGestures
   );
   const handler = useBridgeHandler({
     onMessage,
-    injectedJavaScript: [disableTextSelectionCSS].join("\n"),
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     eventListenerMap: {
       ...appsInTossEventBridges,
@@ -2250,6 +2245,7 @@ function WebView({ type, local, onMessage, ...props }) {
     import_react_native33.BackHandler.addEventListener("hardwareBackPress", callback);
     return () => import_react_native33.BackHandler.removeEventListener("hardwareBackPress", callback);
   }, [webBackHandler]);
+  const globalScripts = useGlobalScripts();
   return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
     BaseWebView,
     {
@@ -2277,13 +2273,78 @@ function WebView({ type, local, onMessage, ...props }) {
       webviewDebuggingEnabled: webViewDebuggingEnabled,
       thirdPartyCookiesEnabled: true,
       onMessage: handler.onMessage,
-      injectedJavaScript: handler.injectedJavaScript,
-      injectedJavaScriptBeforeContentLoaded: handler.injectedJavaScript,
+      injectedJavaScript: globalScripts.afterLoad,
+      injectedJavaScriptBeforeContentLoaded: mergeScripts(handler.injectedJavaScript, globalScripts.beforeLoad),
       decelerationRate: import_react_native33.Platform.OS === "ios" ? 1 : void 0,
       allowsBackForwardNavigationGestures
     }
   );
 }
+function useGlobalScripts() {
+  const global2 = getAppsInTossGlobals();
+  const disableTextSelectionCSS = `
+    const style = document.createElement('style');
+    style.textContent = '*:not(input):not(textarea) { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }';
+    document.head.appendChild(style);
+  `;
+  const applyGameResourcesCache = `
+    (function () {
+      if (typeof caches === 'undefined') {
+        return;
+      }
+      const cacheKeyPrefix = '@apps-in-toss/caches/';
+      const cacheKey = \`\${cacheKeyPrefix}${global2.deploymentId}\`;
+      window.addEventListener('load', async () => {
+        const keys = await caches.keys();
+        for (const key of keys) {
+          if (key.startsWith(cacheKeyPrefix) && key !== cacheKey) {
+            await caches.delete(key);
+          }
+        }
+      });
+      window.fetch = new Proxy(window.fetch, {
+        async apply(originalFetch, thisArg, args) {
+          const request = new Request(args[0], args[1]);
+          if (!/\\.(data|wasm|framework\\.js)(?:\\.gz|\\.br|\\.unityweb)?$/.test(request.url)) {
+            return await originalFetch.call(thisArg, request);
+          }
+          const cache = await caches.open(cacheKey);
+          const cached = await cache.match(request);
+          if (cached) {
+            const eTag = cached.headers.get('ETag');
+            const lastModified = cached.headers.get('Last-Modified');
+            if (eTag) {
+              request.headers.set('If-None-Match', eTag);
+            }
+            if (lastModified) {
+              request.headers.set('If-Modified-Since', lastModified);
+            }
+            const revalidated = await originalFetch.call(thisArg, request);
+            if (revalidated.status === 304) {
+              return cached;
+            }
+            cache.put(request, revalidated.clone());
+            return revalidated;
+          }
+          const response = await originalFetch.call(thisArg, request);
+          cache.put(request, response.clone());
+          return response;
+        },
+      });
+    })();
+  `;
+  return {
+    beforeLoad: mergeScripts(
+      global2.webViewType === "game" && applyGameResourcesCache
+    ),
+    afterLoad: mergeScripts(
+      disableTextSelectionCSS
+    )
+  };
+}
+function mergeScripts(...scripts) {
+  return scripts.filter((script) => typeof script === "string").join("\n");
+}
 
 // src/index.ts
 __reExport(src_exports, require("@apps-in-toss/analytics"), module.exports);

package/dist/index.js

@@ -1579,25 +1579,20 @@ function useBridgeHandler({
   onMessage,
   constantHandlerMap,
   asyncHandlerMap,
-  eventListenerMap,
-  injectedJavaScript: originalInjectedJavaScript
+  eventListenerMap
 }) {
   const ref = useRef4(null);
   const injectedJavaScript = useMemo3(
-    () => [
-      `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
-        Object.entries(constantHandlerMap).reduce(
-          (acc, [key, value]) => {
-            acc[key] = typeof value === "function" ? value() : value;
-            return acc;
-          },
-          {}
-        )
-      )};`,
-      originalInjectedJavaScript,
-      "true"
-    ].join("\n"),
-    [constantHandlerMap, originalInjectedJavaScript]
+    () => `window.__CONSTANT_HANDLER_MAP = ${JSON.stringify(
+      Object.entries(constantHandlerMap).reduce(
+        (acc, [key, value]) => {
+          acc[key] = typeof value === "function" ? value() : value;
+          return acc;
+        },
+        {}
+      )
+    )};`,
+    [constantHandlerMap]
   );
   const createHandleOnEvent = (functionName, eventId) => (response) => {
     ref.current?.injectJavaScript(`
@@ -1613,7 +1608,7 @@ function useBridgeHandler({
   const $onMessage = useCallback10(
     async (e) => {
       onMessage?.(e);
-      const data = JSON.parse(e.nativeEvent.data);
+      const data = parseNativeEventData(e.nativeEvent.data);
       if (typeof data !== "object" || data === null || typeof data.functionName !== "string" || typeof data.eventId !== "string" || typeof data.type !== "string" || !["addEventListener", "removeEventListener", "method"].includes(data.type)) {
         return;
       }
@@ -1659,6 +1654,14 @@ function useBridgeHandler({
     onMessage: $onMessage
   };
 }
+function parseNativeEventData(data) {
+  try {
+    return JSON.parse(data);
+  } catch (error) {
+    console.error(error);
+    return null;
+  }
+}
 
 // src/core/hooks/useWebBackHandler.tsx
 import { closeView as closeView6, useBackEventState } from "@granite-js/react-native";
@@ -2119,19 +2122,11 @@ function WebView({ type, local, onMessage, ...props }) {
   const bottom = useSafeAreaBottom();
   const global2 = getAppsInTossGlobals();
   const navigationBarContext = useNavigationBarContext();
-  const disableTextSelectionCSS = `
-    (function() {
-      const style = document.createElement('style');
-      style.textContent = '*:not(input):not(textarea) { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }';
-      document.head.appendChild(style);
-    })();
-  `;
   const [allowsBackForwardNavigationGestures, setAllowsBackForwardNavigationGestures] = useState8(
     props.allowsBackForwardNavigationGestures
   );
   const handler = useBridgeHandler({
     onMessage,
-    injectedJavaScript: [disableTextSelectionCSS].join("\n"),
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     eventListenerMap: {
       ...appsInTossEventBridges,
@@ -2235,6 +2230,7 @@ function WebView({ type, local, onMessage, ...props }) {
     BackHandler2.addEventListener("hardwareBackPress", callback);
     return () => BackHandler2.removeEventListener("hardwareBackPress", callback);
   }, [webBackHandler]);
+  const globalScripts = useGlobalScripts();
   return /* @__PURE__ */ jsx16(
     BaseWebView,
     {
@@ -2262,13 +2258,78 @@ function WebView({ type, local, onMessage, ...props }) {
       webviewDebuggingEnabled: webViewDebuggingEnabled,
       thirdPartyCookiesEnabled: true,
       onMessage: handler.onMessage,
-      injectedJavaScript: handler.injectedJavaScript,
-      injectedJavaScriptBeforeContentLoaded: handler.injectedJavaScript,
+      injectedJavaScript: globalScripts.afterLoad,
+      injectedJavaScriptBeforeContentLoaded: mergeScripts(handler.injectedJavaScript, globalScripts.beforeLoad),
       decelerationRate: Platform6.OS === "ios" ? 1 : void 0,
       allowsBackForwardNavigationGestures
     }
   );
 }
+function useGlobalScripts() {
+  const global2 = getAppsInTossGlobals();
+  const disableTextSelectionCSS = `
+    const style = document.createElement('style');
+    style.textContent = '*:not(input):not(textarea) { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; }';
+    document.head.appendChild(style);
+  `;
+  const applyGameResourcesCache = `
+    (function () {
+      if (typeof caches === 'undefined') {
+        return;
+      }
+      const cacheKeyPrefix = '@apps-in-toss/caches/';
+      const cacheKey = \`\${cacheKeyPrefix}${global2.deploymentId}\`;
+      window.addEventListener('load', async () => {
+        const keys = await caches.keys();
+        for (const key of keys) {
+          if (key.startsWith(cacheKeyPrefix) && key !== cacheKey) {
+            await caches.delete(key);
+          }
+        }
+      });
+      window.fetch = new Proxy(window.fetch, {
+        async apply(originalFetch, thisArg, args) {
+          const request = new Request(args[0], args[1]);
+          if (!/\\.(data|wasm|framework\\.js)(?:\\.gz|\\.br|\\.unityweb)?$/.test(request.url)) {
+            return await originalFetch.call(thisArg, request);
+          }
+          const cache = await caches.open(cacheKey);
+          const cached = await cache.match(request);
+          if (cached) {
+            const eTag = cached.headers.get('ETag');
+            const lastModified = cached.headers.get('Last-Modified');
+            if (eTag) {
+              request.headers.set('If-None-Match', eTag);
+            }
+            if (lastModified) {
+              request.headers.set('If-Modified-Since', lastModified);
+            }
+            const revalidated = await originalFetch.call(thisArg, request);
+            if (revalidated.status === 304) {
+              return cached;
+            }
+            cache.put(request, revalidated.clone());
+            return revalidated;
+          }
+          const response = await originalFetch.call(thisArg, request);
+          cache.put(request, response.clone());
+          return response;
+        },
+      });
+    })();
+  `;
+  return {
+    beforeLoad: mergeScripts(
+      global2.webViewType === "game" && applyGameResourcesCache
+    ),
+    afterLoad: mergeScripts(
+      disableTextSelectionCSS
+    )
+  };
+}
+function mergeScripts(...scripts) {
+  return scripts.filter((script) => typeof script === "string").join("\n");
+}
 
 // src/index.ts
 export * from "@apps-in-toss/analytics";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@apps-in-toss/framework",
   "type": "module",
-  "version": "1.4.5",
+  "version": "1.4.6",
   "description": "The framework for Apps In Toss",
   "scripts": {
     "prepack": "yarn build",
@@ -56,11 +56,11 @@
     "ait": "./bin/ait.js"
   },
   "dependencies": {
-    "@apps-in-toss/analytics": "1.4.5",
-    "@apps-in-toss/cli": "1.4.5",
-    "@apps-in-toss/native-modules": "1.4.5",
-    "@apps-in-toss/plugins": "1.4.5",
-    "@apps-in-toss/types": "1.4.5",
+    "@apps-in-toss/analytics": "1.4.6",
+    "@apps-in-toss/cli": "1.4.6",
+    "@apps-in-toss/native-modules": "1.4.6",
+    "@apps-in-toss/plugins": "1.4.6",
+    "@apps-in-toss/types": "1.4.6",
     "es-hangul": "^2.3.2"
   },
   "devDependencies": {
@@ -96,5 +96,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "62245d6361e8c062814ca80002b230ea281a15ff"
+  "gitHead": "8ed7aaf219f9afa8146361cc4508d0c425f3b3d6"
 }