Home » Javascript » jQuery writing iframe to XLS causes sandbox access violation on iPhone

jQuery writing iframe to XLS causes sandbox access violation on iPhone

Posted by: admin November 1, 2017 Leave a comment


I have a button input attached to a jQuery action that writes an iframe into the DOM. The iframe points to a PHP script that assembles an Excel file for force download.

This button works fine on desktop hardware, but recent versions of Mac OS X for the iPhone cause this script to throw a Javascript error into the browser console and appears to be failing to ever insert the iframe into the DOM. I replicated the error on iOS v10.3.3 and v11.0.1.

iOS v10.3.3 throws the following Javascript error:

SecurityError (DOM Exception 18): Sandbox access violation: Blocked a frame at “https://www.[REDACTED].com” from accessing a frame at “https://www.[REDACTED].com“. The frame being accessed is sandboxed and lacks the “allow-same-origin” flag. in https://www.[REDACTED].com/path/jquery/jquery.min.js on line 3

iOS v11.0.1 throws the following:

SecurityError (DOM Exception 18): Blocked a frame with origin
https://www.[REDACTED].com” from accessing a frame with origin
“x-apple-ql-id://256b58b2-0821-4779-810b-5493faa49e07”. The frame
requesting access has a protocol of “https”, the frame being accessed
has a protocol of “https”. Protocols must match. in
https://www.[REDACTED].com/modules/jquery/jquery.min.js on line 3

Here is the Javascript I am working with.

var LOCAL = {
    execReport : function()
        // Get form inputs
        var t = $('select[name="t"] option:selected').val();
        var s = $('select[name="s"] option:selected').val();

        // Write the iframe into the DOM
        var iframe = $('<iframe></iframe>', {
            'src' : '/xls/observationsReport.php?gid=' + majGroup.gid + '&season=' + s + '&t=' + t,
            'id' : 'reportIframe',
            'width' : '1',
            'height' : '1',
            'frameborder' : '0',
            'scrolling' : 'no',
            'sandbox' : 'allow-same-origin'
        }).appendTo('body').on('load', function() {
            // Wait for the iframe to finish loading
            var response = $.parseJSON($('#reportIframe').contents().find('body').html());

            // Show any errors that happened
            if (response && response.error)
                // If the report assembly threw an error, display it here
                // This is NOT related to the Javascript error I am experiencing!