inframejs - npm Package Compare versions

Comparing version 1.0.5 to 1.0.6

dist/inframejs.es.min.js

 /*! 
    name: iframeBridge
-   version: 1.0.2
+   version: 1.0.5
    file: inframejs.min.js
    author: web.szy
-   buildTime: 2022/2/15 下午5:08:25
+   buildTime: 2022/2/16 下午3:55:29
  */
+const version = "1.0.5";
 const Inframe = class {
-  constructor({ target, whiteList, libName, debug, opener } = {}) {
-    this.setTargetIframe(target);
+  constructor({ target, whiteList, libName, debug, isSubPage, isNewWindow } = {}) {
+    this.setTarget(target);
     this.setLibName(libName);
     if (typeof whiteList !== "undefined" && !Array.isArray(whiteList)) {
-      console.warn("whiteList must be a Array");
+      console.warn("whiteList must be a domain Array");
       return false;
     }
-    this.whiteList = whiteList || [];
+    this.isNewWindow = isNewWindow;
+    this.whiteList = (whiteList || []).filter((e) => typeof e === "string").map((e) => e.toLowerCase());
     this.debug = !!debug;
-    this.opener = opener;
+    this.isSubPage = typeof isSubPage === "undefined" ? true : isSubPage;
+    this.isConneted = this.isSubPage;
+    this.version = version;
     this.handlersMap = /* @__PURE__ */ new Map();
+    this.emitCache = [];
     if (!window) {
@@ -26,20 +31,21 @@ console.warn(`inframe bridge must init on the browser`);
     window.addEventListener("message", this.handleEvent.bind(this));
-    if (this.targetIframe) {
-      this.on("connected", (e) => console.log(e));
+    if (this.isSubPage) {
+      this.emit("connected", "sub Page connected");
+      console.log("sub instance", this);
     } else {
-      console.log("sub instance", this);
-      this.emit("connected", "sub Page connected");
+      this.on("connected", () => {
+        this.isConneted = true;
+        this.emitCache.forEach(({ eventName, data }) => this.emit(eventName, data));
+        this.emitCache = [];
+      });
     }
     return this;
   }
-  setTargetIframe(target) {
+  setTarget(target) {
     if (typeof target === "string") {
-      this.targetIframe = document.querySelector(target);
-      this.pageName = "main";
+      this.target = document.querySelector(target);
     } else if (typeof target !== "undefined") {
-      this.targetIframe = target;
-      this.pageName = "main";
+      this.target = target;
     } else {
-      this.targetIframe = null;
-      this.pageName = "sub";
+      this.target = null;
     }
@@ -69,17 +75,26 @@ }
       params: data,
-      lib: this.libName
+      lib: this.libName,
+      isSubPage: this.isSubPage
     };
-    this.logger(`${eventName} has been emitted::${JSON.stringify(msg)}`);
-    if (this.targetIframe) {
-      if (this.opener) {
-        this.targetIframe.opener.postMessage(msg, "*");
+    this.logger(`${eventName} has been emit::${JSON.stringify(msg)}`);
+    if (this.isConneted) {
+      if (this.isSubPage) {
+        if (this.isNewWindow) {
+          window.opener.postMessage(msg, "*");
+        } else {
+          window.parent.postMessage(msg, "*");
+        }
       } else {
-        this.targetIframe.contentWindow.postMessage(msg, "*");
+        if (this.isNewWindow) {
+          this.target.postMessage(msg, "*");
+        } else {
+          this.target.contentWindow.postMessage(msg, "*");
+        }
       }
     } else {
-      window.parent.postMessage(msg, "*");
+      this.emitCache.push({ eventName, data });
     }
   }
   handleEvent(e) {
-    if (!e || typeof e.data !== "object" || !(e.data.lib && e.data.lib === this.libName)) {
+    if (!e || typeof e.data !== "object" || !(e.data.lib && e.data.lib === this.libName) || this.isSubPage === e.data.isSubPage) {
       return;
@@ -95,4 +110,4 @@ }
     const { data } = e;
-    this.logger(`received data: ${JSON.stringify(data)}`);
     if (this.handlersMap.has(data.event)) {
+      this.logger(`received data: ${JSON.stringify(data)}`);
       const handlers = this.handlersMap.get(data.event);
@@ -115,5 +130,6 @@ handlers.forEach((handler) => handler(data));
     const time = `${d.getHours()}:${d.getMinutes()}:${d.getSeconds()}`;
-    console.log(`${time}-${this.pageName}::${message}`);
+    const pageName = this.isSubPage ? "\u5B50\u9875\u9762" : "\u4E3B\u9875\u9762";
+    console.log(`${time}-${pageName}::${message}`);
   }
 };
 export { Inframe as default };

dist/inframejs.umd.min.js

 /*! 
    name: iframeBridge
-   version: 1.0.2
+   version: 1.0.5
    file: inframejs.min.js
    author: web.szy
-   buildTime: 2022/2/15 下午5:08:25
+   buildTime: 2022/2/16 下午3:55:29
  */
-(function(n,e){typeof exports=="object"&&typeof module!="undefined"?module.exports=e():typeof define=="function"&&define.amd?define(e):(n=typeof globalThis!="undefined"?globalThis:n||self,n.inframejs=e())})(this,function(){"use strict";return class{constructor({target:e,whiteList:t,libName:s,debug:i,opener:a}={}){return this.setTargetIframe(e),this.setLibName(s),typeof t!="undefined"&&!Array.isArray(t)?(console.warn("whiteList must be a Array"),!1):(this.whiteList=t||[],this.debug=!!i,this.opener=a,this.handlersMap=new Map,window?(window.getInframeInstace=()=>this,window.addEventListener("message",this.handleEvent.bind(this)),this.targetIframe?this.on("connected",r=>console.log(r)):(console.log("sub instance",this),this.emit("connected","sub Page connected")),this):(console.warn("inframe bridge must init on the browser"),!1))}setTargetIframe(e){typeof e=="string"?(this.targetIframe=document.querySelector(e),this.pageName="main"):typeof e!="undefined"?(this.targetIframe=e,this.pageName="main"):(this.targetIframe=null,this.pageName="sub")}setLibName(e){this.libName=e||"inframe"}on(e,t){if(this.logger(`${e} has been watched`),this.handlersMap.has(e)){const s=this.handlersMap.get(e);s.push(t),this.handlersMap.set(e,s)}else this.handlersMap.set(e,[t])}off(e){this.handlersMap.has(e)&&this.handlersMap.delete(e)}emit(e,t){const s={event:e,params:t,lib:this.libName};this.logger(`${e} has been emitted::${JSON.stringify(s)}`),this.targetIframe?this.opener?this.targetIframe.opener.postMessage(s,"*"):this.targetIframe.contentWindow.postMessage(s,"*"):window.parent.postMessage(s,"*")}handleEvent(e){if(!e||typeof e.data!="object"||!(e.data.lib&&e.data.lib===this.libName))return;if(this.whiteList.length&&!this.whiteList.some(i=>~i.indexOf(e.origin))){console.warn("you are not access to inframe");return}const{data:t}=e;this.logger(`received data: ${JSON.stringify(t)}`),this.handlersMap.has(t.event)?this.handlersMap.get(t.event).forEach(i=>i(t)):this.logger(`handlers not find: ${JSON.stringify(t)}`)}destroy(){this.handlersMap.clear(),window.getInframeInstace=null,window.removeEventListener("message",this.handleEvent)}logger(e){if(!this.debug)return;const t=new Date,s=`${t.getHours()}:${t.getMinutes()}:${t.getSeconds()}`;console.log(`${s}-${this.pageName}::${e}`)}}});
+(function(n,h){typeof exports=="object"&&typeof module!="undefined"?module.exports=h():typeof define=="function"&&define.amd?define(h):(n=typeof globalThis!="undefined"?globalThis:n||self,n.inframejs=h())})(this,function(){"use strict";const n="1.0.5";return class{constructor({target:e,whiteList:s,libName:t,debug:i,isSubPage:o,isNewWindow:r}={}){return this.setTarget(e),this.setLibName(t),typeof s!="undefined"&&!Array.isArray(s)?(console.warn("whiteList must be a domain Array"),!1):(this.isNewWindow=r,this.whiteList=(s||[]).filter(a=>typeof a=="string").map(a=>a.toLowerCase()),this.debug=!!i,this.isSubPage=typeof o=="undefined"?!0:o,this.isConneted=this.isSubPage,this.version=n,this.handlersMap=new Map,this.emitCache=[],window?(window.getInframeInstace=()=>this,window.addEventListener("message",this.handleEvent.bind(this)),this.isSubPage?(this.emit("connected","sub Page connected"),console.log("sub instance",this)):this.on("connected",()=>{this.isConneted=!0,this.emitCache.forEach(({eventName:a,data:d})=>this.emit(a,d)),this.emitCache=[]}),this):(console.warn("inframe bridge must init on the browser"),!1))}setTarget(e){typeof e=="string"?this.target=document.querySelector(e):typeof e!="undefined"?this.target=e:this.target=null}setLibName(e){this.libName=e||"inframe"}on(e,s){if(this.logger(`${e} has been watched`),this.handlersMap.has(e)){const t=this.handlersMap.get(e);t.push(s),this.handlersMap.set(e,t)}else this.handlersMap.set(e,[s])}off(e){this.handlersMap.has(e)&&this.handlersMap.delete(e)}emit(e,s){const t={event:e,params:s,lib:this.libName,isSubPage:this.isSubPage};this.logger(`${e} has been emit::${JSON.stringify(t)}`),this.isConneted?this.isSubPage?this.isNewWindow?window.opener.postMessage(t,"*"):window.parent.postMessage(t,"*"):this.isNewWindow?this.target.postMessage(t,"*"):this.target.contentWindow.postMessage(t,"*"):this.emitCache.push({eventName:e,data:s})}handleEvent(e){if(!e||typeof e.data!="object"||!(e.data.lib&&e.data.lib===this.libName)||this.isSubPage===e.data.isSubPage)return;if(this.whiteList.length&&!this.whiteList.some(i=>~i.indexOf(e.origin))){console.warn("you are not access to inframe");return}const{data:s}=e;this.handlersMap.has(s.event)?(this.logger(`received data: ${JSON.stringify(s)}`),this.handlersMap.get(s.event).forEach(i=>i(s))):this.logger(`handlers not find: ${JSON.stringify(s)}`)}destroy(){this.handlersMap.clear(),window.getInframeInstace=null,window.removeEventListener("message",this.handleEvent)}logger(e){if(!this.debug)return;const s=new Date,t=`${s.getHours()}:${s.getMinutes()}:${s.getSeconds()}`,i=this.isSubPage?"\u5B50\u9875\u9762":"\u4E3B\u9875\u9762";console.log(`${t}-${i}::${e}`)}}});

package.json

 {
   "name": "inframejs",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "use pure Javascript to connect the iframe pages",
@@ -5,0 +5,0 @@ "main": "dist/inframejs.es.min.js",

src/index.js

@@ -0,13 +1,32 @@
+import {version} from '../package.json'
+/*
+* @params
+* target:any window对象，或iframe,或class名，id名
+* whiteList:array 域名白名单
+* libName:string 通信时校验名
+* debug:boolean 是否打印日志
+* isSubPage:boolean 是否子页面
+* isNewWindow:boolean 是否是新窗口打开
+* */
+/*
+* 缓冲池
+* 子页面报告connected之后再发送事件，之前将所有发送的缓存
+* */
 const Inframe = class {
-    constructor({target, whiteList, libName,debug,opener} = {}) {
-        this.setTargetIframe(target)
+    constructor({target, whiteList, libName,debug,isSubPage,isNewWindow} = {}) {
+        this.setTarget(target)
         this.setLibName(libName)
         if (typeof whiteList !== 'undefined' && !Array.isArray(whiteList)) {
-            console.warn('whiteList must be a Array')
+            console.warn('whiteList must be a domain Array')
             return false
         }
-        this.whiteList = whiteList || []
+
+        this.isNewWindow = isNewWindow
+        this.whiteList = (whiteList || []).filter(e=>typeof e === 'string').map(e=>e.toLowerCase())
         this.debug = !!debug
-        this.opener = opener
+        this.isSubPage = typeof isSubPage === 'undefined'? true : isSubPage
+        this.isConneted = this.isSubPage
+        this.version = version
         this.handlersMap = new Map()
+        this.emitCache = []
         if (!window) {
@@ -19,7 +38,11 @@ console.warn(`inframe bridge must init on the browser`)
         window.addEventListener('message', this.handleEvent.bind(this))
-        if (this.targetIframe) {
-            this.on('connected', (e) => console.log(e))
+        if (this.isSubPage) {
+            this.emit('connected','sub Page connected')
+            console.log('sub instance',this)
         } else {
-            console.log('sub instance',this)
-            this.emit('connected','sub Page connected')
+            this.on('connected',()=>{
+                this.isConneted = true
+                this.emitCache.forEach(({eventName,data})=>this.emit(eventName,data))
+                this.emitCache = []
+            })
         }
@@ -29,12 +52,9 @@ return this
 
-    setTargetIframe(target) {
+    setTarget(target) {
         if (typeof target === 'string') {
-            this.targetIframe = document.querySelector(target);
-            this.pageName='main'
+            this.target = document.querySelector(target);
         } else if (typeof target !== 'undefined') {
-            this.targetIframe = target
-            this.pageName='main'
+            this.target = target
         } else {
-            this.targetIframe = null
-            this.pageName='sub'
+            this.target = null
         }
@@ -69,13 +89,23 @@ }
             lib: this.libName,
-            pageName:this.pageName
+            isSubPage:this.isSubPage
         }
-        this.logger(`${eventName} has been emitted::${JSON.stringify(msg)}`)
-        if (this.targetIframe) {
-            if(this.opener){
-                this.targetIframe.opener.postMessage(msg, '*')
+        this.logger(`${eventName} has been emit::${JSON.stringify(msg)}`)
+        if(this.isConneted){
+            if(this.isSubPage){
+                // 子页面
+                if(this.isNewWindow){
+                    window.opener.postMessage(msg,'*')
+                } else {
+                    window.parent.postMessage(msg,'*')
+                }
             } else {
-                this.targetIframe.contentWindow.postMessage(msg, '*')
+                // 主页面通过window.open打开了
+                if(this.isNewWindow){
+                    this.target.postMessage(msg,'*')
+                } else {
+                    this.target.contentWindow.postMessage(msg,'*')
+                }
             }
         } else {
-            window.parent.postMessage(msg, '*')
+            this.emitCache.push({eventName, data})
         }
@@ -89,3 +119,3 @@ }
             !(e.data.lib && e.data.lib === this.libName) ||
-            this.pageName === e.data.pageName
+            this.isSubPage === e.data.isSubPage
         ) {
@@ -124,5 +154,6 @@ return
         const time = `${d.getHours()}:${d.getMinutes()}:${d.getSeconds()}`
-        console.log(`${time}-${this.pageName}::${message}`)
+        const pageName = this.isSubPage ? '子页面' : '主页面'
+        console.log(`${time}-${pageName}::${message}`)
     }
 }
 export default Inframe

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

14545

increased by17.74%

Lines of code

339

increased by16.49%

No dependency changes