Appsmith - iFrame父子通信配置

子页面配置

1. 发送消息给父页面：

   const data = {
     type: "child2parent",
     payload: "我是子消息" + new Date()
   };
   postWindowMessage(data, "window", "*");
   

2. 注册监听消息

   // 需要配置"Run on page load"
   async listenMessage() {
     const origin = appsmith.URL.protocol + "//" + appsmith.URL.host; //host包含端口
     windowMessageListener(origin, (data) => {
       if (data.type === "parent2child") {
         console.log("子页面接收：" + data.payload);
       }
     })
   }
   

父页面配置

1. 拖入一个 Iframe 组件，填入URL：http://172.16.40.197/app/子页面?embed=true
2. 发送消息给子页面

   const data = {
     type: "parent2child",
     payload: "我是父消息" + new Date()
   };
   postWindowMessage(data, "Iframe1", "*");
   

3. 注册监听消息

   // 需要配置"Run on page load"
   async listenMessage() {
     const origin = appsmith.URL.protocol + "//" + appsmith.URL.host; //host包含端口
     windowMessageListener(origin, (data) => {
       if (data.type === "child2parent") {
         console.log("父页面接收：" + data.payload);
       }
     })
   }