Using JWT

<iframe
        src='widgets.kruzr.io/#/widgets/WIDGET_ID?callBackId=CallBackId&startTime=TIME&endTime=TIME&os=SUPPORTED_OS'
        loading="lazy"
        width="50%"
        height="30%"
        style="margin:auto;display:block;border: none;">
 </iframe>

The url consists of a parameter called callBackId. You can pass a unique ID, which be passed on to your window.onmessage method when the widget get loaded. A key value structured for our event.data object is being followed. You will get the callbackId in event.data.value against widgetLoaded as event.data.key.

window.onmessage = (event) => { 
            if(event.data.key === "widgetLoaded"){
                const callBackId = event.data.value
            }
}

Based on the callbackId, you can target your specific widget and load the JWT in it using the following method. ( loadjwt as key and the jwt as value object)

// authKey obtained fom last step.
window.onmessage = (event) => { 
            if(event.data.key === "widgetLoaded"){
                const newSet = { key : "loadjwt" , value : authKey};
                const callBackId = event.data.value;
                switch(callBackId) {
                    case "1" :
                        document.getElementById("myiframe1").contentWindow.postMessage(newSet,"https://widgets.portals.io");
                        break;
                        .
                        .
                        .
                }
            }
}