Best way to integrate external webpage into Perspective?

I’m looking to build a highly customized page that includes some mapping components that I dont think will be possible using the built-in map component.

Is there any ideas about what the best approach would be to build a webpage that can sit docked in a perspective project? They would still like to use perspective to be able to make changes to other pages using the gui. As far as I can see the iframe is the only approach, but there would need to be some communication between the iframe and the perspective session. I can pass data to the iframe through the url, but I dont think I could get anything back, like for instance if a user clicks on an icon. Thoughts?

Iframes are, generally speaking, sandboxed specifically to prevent the ‘outer’ layer from reading information from the inner layer. Imagine a malicious site, that loaded your email/your bank/etc in the iframe, and had no visible content on the outer layer. If you were tricked into signing into your bank inside the frame, then the outer layer could get access to credentials, secret information, etc.

If you’re modestly comfortable with web development, there’s not that much involved in creating a module for Perspective; you’ll need to know some React and be able to figure out the gradle build process just to actually build a module, but it would definitely be the more performant and more secure option.

I don’t know within perspective, but its possible to build your own HTML page with any content on it including google maps or map-box and interact with Ignition tags or data base using webDev module. See my RWS module on Exchange portal. I have tried a Geo Location tracking module as well using google maps but its currently disabled. Just for your info.

Dumb question about the web environment:
The way that perspective has message sending and handling capabilities, for communication between embedded views and other views on the page. Is there a term for doing this kind of thing in the web environment that could be implemented in a module? So for instance you could send a “page scoped message” from the embedded page, and handle it in perspective? All I would assume would have to be built into a module.

That message handling is entirely an Ignition/Perspective concept (to my knowledge); the actual event bus for those messages is the Java backend, so you’re doubly-prevented from accessing that mechanism from an embedded frame. A Perspective component can do it (because they exist on both the front and backend) but any generic JS code could not, outside of something built to interact with Perspective’s undocumented APIs from the live page.

1 Like

Hey actually, I thought of this a little late, and wasn’t sure if this was what this line meant. But could you theoretically do this with the web dev module and gateway api calls? You could pass your sessionid/pageid as parameters to the iFrame webpage, then use those parameters in API calls to the gateway through web dev, using the sessionid/pageid to make perspective message calls to your page. A bit roundabout of a way to do it but potentially a lot easier than building a module

You could parameterize the gateway api in webdev with messageType, pageid, sessionid, pageid and just call it like you would a message handler but through an api payload

2 Likes

Yeah, that’s a valid workaround; an advantage of the flexibility of the Ignition platform :wink:

2 Likes

My RWS module on Exchange portal given above can be modified to receive the session ID/Parameter ID etc to send the response to iFrame web page !

1 Like

Ah cool, both of these answers are very helpful. I think I’m going to look into building a module, but the API message route will surely be helpful as well. Thanks everyone.

1 Like