Perspective, Issues with WebSockets when embedding page as iFrame

Hello,

I have a perspective project running within an Ignition Gateway within my company's network. I have a digital signage tool which i would like to leverage this perspective project, and project it out to a display within the company. The Digital signage solution is struggling to pull through and host the perspective session. I've recently gotten websockets and HTTPS allowed on company's firewall, TLS/HTTPS is installed on the ignition gateway properly.

So i have Ignition Gateway server as 1.1.1.1 x.x.x.x
and I have digital signage server at 2.2.2.2 y.y.y.y

When I am signed into server application, at 2.2.2.2 y.y.y.y, I add "HTML content" which points to URL https://1.1.1.1x.x.x.x/data/perspective/client/ProjectA.

When i try to preview the page i have put together, on 2.2.2.2
y.y.y.y, which is embedding the perspective projectA; I get the following errors:

The view on 2.2.2.2 y.y.y.y gets stuck indefinitely on this page from the 1.1.1.1x.x.x.x Perspective project and server.

these are the web browser console errors:

Does anyone have experience working through a problem similar to this? I am a little stuck on how to get this working.

You may look at this post. Anytime I have tried using perspective as an embeded view I have needed to change stuff in the .conf file.

1 Like

Thank you, Benjamin. I am going to give this a try...

Those are not Private Network Addresses. 1.1.1.1, for example, is owned by a partnership between Cloudflare and APNIC and, as far as I know, is a DNS server. Any standard routing configuration in your business will route 1.1.1.1 out to the Internet.

Stick to these ranges if you want to avoid problems.

RFC 1918 name IP address range Classful description
24-bit block 10.0.0.0 – 10.255.255.255 single class A network
20-bit block 172.16.0.0 – 172.31.255.255 16 contiguous class B networks
16-bit block 192.168.0.0 – 192.168.255.255 256 contiguous class C networks

I don't know if that's the whole problem but it's certainly a problem to be avoided.

1 Like

sorry i think i chose bad IP addresses as examples, i was just trying to indicate that the servers in this scenario are two seperate network locations.

I have two servers, each with their own I.P. Address. the 1.1.1.1 and 2.2.2.2 are not the actual IP addressess

OK. Edit the original question and use the <del> ... </del> syntax to make it read 1.1.1.1 x.x.x.x and 2.2.2.2 x.x.y.y or whatever (but make it clear that there's an edit).

Done, thanks for providing the syntax to do that edit

I have created the following simple website, to take server and web application y.y.y.y (digital signage solution) out of the equation.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Embedded Ignition Perspective Dashboard</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #f0f0f0;
        }
        iframe {
            border: 1px solid #ccc;
            width: 80%;
            height: 80%;
        }
    </style>
</head>
<body>
    <iframe src="https://x.x.x.x/data/perspective/client/ProjectA/" title="Ignition Perspective Dashboard"></iframe>
</body>

</html>

This reproduces the same issue, while instead just using a browser on my own laptop (whilst also on the same company network) from source ip address z.z.z.z which is serving simple pageindex.html through opera browser in my screenshot

PerspectiveClient.60c16865dfd7f31a5209.js:2 WebSocket connection to 'wss://usea1svigngtw01.moog.com/system/pws/CleanRoom/3c63c14?token=ryxQxmDCh9Sw8Ar6XpUC-5NknsBiOlwp3vYUFhxEZ3A' failed: 
connect @ PerspectiveClient.60c16865dfd7f31a5209.js:2
onStateChange @ PerspectiveClient.60c16865dfd7f31a5209.js:2
ye @ mobx-5.15.7.js:15
r @ mobx-5.15.7.js:15
y @ mobx-5.15.7.js:15
(anonymous) @ mobx-5.15.7.js:15
t.runReaction @ mobx-5.15.7.js:15
qe @ mobx-5.15.7.js:15
Ue @ mobx-5.15.7.js:15
Ge @ mobx-5.15.7.js:15
ke @ mobx-5.15.7.js:15
ge @ mobx-5.15.7.js:15
ye @ mobx-5.15.7.js:15
r @ mobx-5.15.7.js:15
onHelloFulfilled @ PerspectiveClient.60c16865dfd7f31a5209.js:2
PerspectiveClient.60c16865dfd7f31a5209.js:2 store.Channel: Websocket connection closed. code=1006, wasClean=false, reason=No reason given, codeMeaning=Code not defined, codeDescription=Code out of range.

This almost always means some infrastructure in your network is either not compatible with websockets (older firewalls) or is trying and failing to do deep packet inspection. Escalate this to your IT folk.

This worked after implementing the following changes to ignition.conf AND RESTARTING! (i forgot to restart when i first tried these changes)

wrapper.java.additional.1=-Dignition.http.header.x_frame_options.enabled=false
wrapper.java.additional.2=-Dignition.http.header.x_content_type_options.enabled=false
wrapper.java.additional.3=-Dignition.http.header.x_xss_protection.enabled=false
wrapper.java.additional.4=-Dignition.http.header.referrer_policy.enabled=false
wrapper.java.additional.5=-Dignition.http.session.cookie.same-site.enabled=true
wrapper.java.additional.6=-Dignition.http.session.cookie.same-site.value=None
1 Like