VxproIframe

This package is to help, create customized iframe component that can be integrated to the the parent application, where the communication between the two parties can happen seamlesly. This can be done easily done by using the features supported by the package.

This package supports currently angular application with version 11.2.14.

Installation

Parent and child angular application installation

npm i @vxpro/iframe

Usage

Parent application

Parent angular application need to import IframeModule from the package to use vxpro-iframe.

// Parent application module
import { WindowMessage } from '@vxpro/iframe';

@NgModule({
    imports: [
        ...
        IframeModule
    ]
})

<vxpro-iframe
    [src]="iframeURL"
    [allow]="'camera; microphone; fullscreen; speaker; display-capture'"
    [seamless]="true"
    [config]="config"
    (close)="onClose()"
></vxpro-iframe>

Options

src

Its the url of iframe applications

allow

Allow permission to access the features provided by iframe like camera, mic.

seamless

When present, it specifies that the should look like it is a part of the containing document. There will not be any border or scrollbar.

config

This is the configuration data required to be shared with child iframe.

close

This will be called by the child iframe to close the iframe application.

Child iframe application

Child iframe application can use dependancy package windows-message or can directly use windows message event to recieve and send messages