chore: requestable.

radiorz · Aug 1, 2024 · a1ac0fc · a1ac0fc
1 parent 789a0d5
commit a1ac0fc
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 10 deletions.
diff --git a/packages/requestable/examples/window-postmessage/child.html b/packages/requestable/examples/window-postmessage/child.html
@@ -10,26 +10,32 @@
 <body>
   <div>child</div>
   <script type="module">
-    import { Requestable } from '../../dist/index.mjs'
+    import { Requestable, Responsive } from '../../dist/index.mjs'
     const emitter = {
       on(topic, cb) {
         window.addEventListener('message', (event) => {
+          console.log(`child receive event.data`, event.data)
           if (event.data.topic !== topic) {
             return
           }
           cb(event.data.message)
         })
       },
       emit(topic, message) {
+        console.log(`child emit topic,message`, topic, message)
         window.parent.postMessage({ topic, message }, '*')
       }
     }
-    const requestable = new Requestable({
-      emitter
+    const responsive = new Responsive({ emitter })
+    responsive.addRoute('home', (data) => {
+      return 'home from child'
     })
-    requestable.init()
+    responsive.init()
     async function bootstrap() {
-      console.log(`123`, 123)
+      const requestable = new Requestable({
+        emitter
+      })
+      requestable.init()
       const result = await requestable.request({
         url: 'home',
         payload: {

diff --git a/packages/requestable/examples/window-postmessage/index.html b/packages/requestable/examples/window-postmessage/index.html
@@ -10,30 +10,54 @@
 <body>
   <iframe id="child" src="./child.html" width="50%" height="50%"></iframe>
   <script type="module">
-    import { Responsive } from '../../dist/index.mjs'
+    import { Responsive, Requestable } from '../../dist/index.mjs'
     const emitter = {
       source: null,
       on(topic, cb) {
+        console.log(`topic`, topic)
         window.addEventListener('message', (event) => {
-          this.source = event.source
+          // console.log(`parent message`, event.data.topic, topic)
+          // this.source = event.source
           if (event.data.topic !== topic) {
             return
           }
           cb(event.data.message)
         })
       },
       emit(topic, message) {
-        this.source.postMessage({ topic, message }, '*')
+        // this.source.postMessage({ topic, message }, '*')
+        child.contentWindow.postMessage({ topic, message }, '*')
       }
     }
     const responsive = new Responsive({
       emitter
     })
     responsive.addRoute('home', (data) => {
-      console.log(`data`, data)
-      return 123123
+      return data
     })
     responsive.init()
+    async function bootstrap() {
+      const requestable = new Requestable({
+        emitter
+      })
+      requestable.init()
+      const result = await requestable.request({
+        url: 'home',
+        payload: {
+          a: 123
+        }
+      })
+      console.log(`result`, result)
+      const resultFail = await requestable.request({
+        url: 'hhh',
+        payload: null
+      })
+      console.log(`resultFail`, resultFail)
+    }
+    setTimeout(() => {
+
+      bootstrap()
+    }, 1000)
   </script>
 </body>