Configuring IFrame communication

The Zowe Application Framework provides the following shared resource functions through a ZoweZLUX object: pluginManager, uriBroker, dispatcher, logger, registry, notificationManager, and globalization

Like REACT and Angular apps, IFrame apps can use the ZoweZLUX object to communicate with the framework and other apps. To enable communication in an IFrame app, you must add the following javascript to your app, for example in your index.html file:

<script>
 if(exports){
  var ZoweZLUX_tempExports = exports;
 }
 var exports = {"__esModule": true};

</script>
<script type="text/javascript" src="../../../../../lib/org.zowe.zlux.logger/0.9.0/logger.js"></script>
<script type="text/javascript" src="../../../org.zowe.zlux.bootstrap/web/iframe-adapter.js"></script>

logger.js is the javascript version of logger.ts and is capable of the same functions, including access to the Logger and ComponentLogger classes. The Logger class determines the behavior of all the ComponentLoggers created from it. ComponentLoggers are what the user implements to perform logging.

Iframe-adapter.js is designed to mimic the ZoweZLUX object that is available to apps within the virtual-desktop, and serves as the middle-man for communication between IFrame apps and the Zowe desktop.

You can see an implementation of this functionality in the sample IFrame app.

The version of ZoweZLUX adapted for IFrame apps is not complete and only implements the functions needed to allow the Sample IFrame App to function. The notificationManager, logger, globalization, dispatcher, windowActions, windowEvents, and viewportEvents are fully implemented. The pluginManager and uriBroker are only partially implemented. The registry is not implemented.

Unlike REACT and Angular apps, in IFrame apps the ZoweZLUX and initialization objects communicate with Zowe using the browser's onmessage and postmessage APIs. That means that communication operations are asynchronous, and you must account for this in your app, for example by using Promise objects and await or then functions.