'window.opener undefined in javascript popup after redirect

I have a problem with a website that displays a payment dialog using window.open().

The page in the popup redirects to a different domain that redirects back to a result page. On the result page, I try to set a property on window.opener to signal that the payment is ok.

This works for some users. Other users, however, get an error saying that window.opener is undefined.

The problem can the recreated using these simple pages:

index.html (Opens the popup)

<!DOCTYPE html>
<html lang="en">
<body>
    <input type="button" value="Popup" onclick="openPaymentWindow();" />

    <div id="result" style="background-color: silver;"/>

    <script type="text/javascript">
        function openPaymentWindow() {
            win = window.open('popup.html', 'popup');            
        }
    </script>    
</body>
</html>

popup.html (Redirects to a different domain)

<!DOCTYPE html>
<html>
<body onload="document.forms[0].submit();">
    <form action="http://[other_domain]/payment.html">
    </form>
</body>
</html>

payment.html (Redirects back to the original domain)

<!DOCTYPE html>
<html>
<body onload="document.forms[0].submit();">
    <form action="http://[original_domain]/result.html">
    </form>    
</body>
</html>

result.html (Sets a property on the index page)

<!DOCTYPE html>
<html>
<body>
    <input type="button" value="Call top" onclick="callTop();" />

    <script type="text/javascript">
        function callTop() {
            // Here, window.opener (and top.opener) is undefined for some users
            window.opener.document.getElementById('result').style.background = 'green';
        }
    </script>  
</body>
</html>

Since not all users are affected, my guess is that it has to do with some security settings. But I simply cannot figure out where to find them - or how to replicate the error on my own pc.

javascripthtml


Solution 1:[1]

There is a way to achieve what you want, it may not be very clean though. So index.html and result.html are on the same domain and script in index.html contains a reference to window object of a popup. This means that if you set some property on window object in result.html you will be able to read that property on win variable in index.html. The only problem is you don't know when exactly the property is being set, so you will have to use setInterval to check it.

Index.html 

function openPaymentWindow() {
    var win = window.open('popup.html', 'popup');

    var successPoller = setInterval(function() {
        try {
            if(typeof win.PAYMENT_SUCESS !== 'undefined' && win.PAYMENT_SUCESS) {
                document.getElementById('result').style.background = 'green';
                clearInterval(successPoller);
            }
        }
        catch (error) {
            // handle error
        }
    }, 500);
}

result.html 

 function callTop() {
      window.PAYMENT_SUCCESS = true;  
 }

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions