bradenmacdonald · March 29, 2019 21:32
diff --git a/xblock-bootstrap.html b/xblock-bootstrap.html
 <!--
 This file is meant to be hosted on a completely separate domain name
 from the LMS / frontend that is hosting the Open edX content (XBlocks).

 Doing so allows us to enable features like cookies in the sandboxed
 IFrame while keeping the XBlock content on a distinct origin, so that
 the XBlock cannot access user data from the host application (like
 cookies nor call APIs as the user).

 This particular sandboxing code uses the secure message passing API
 to request the XBlock HTML from the host application and then replaces
 its content with that HTML.
 -->
 <!DOCTYPE html>
 <html>
 <head>
    <meta charset="UTF-8">
 </head>
 <body>
    <script>
        const uniqueKeyPrefix = `k${+Date.now()}-${Math.floor(Math.random() * 1e10)}-`;
        var messageCount = 0;
        function postMessageToParent(messageData, callback) {
            const messageReplyKey = uniqueKeyPrefix + (messageCount++);
            messageData.replyKey = messageReplyKey;
            if (callback !== undefined) {
                const handleResponse = function (event) {
                    if (event.source === window.parent && event.data.replyKey === messageReplyKey) {
                        callback(event.data);
                        window.removeEventListener('message', handleResponse);
                    }
                };
                window.addEventListener('message', handleResponse);
            }
            window.parent.postMessage(messageData, '*');
        }
        // Request the HTML from the parent and then completely replace this entire
        // HTML document with the resulting HTML
        postMessageToParent({method: 'bootstrap'}, function(data) {
            document.open();
            document.write(data.initialHtml);
            document.close();
        });
    </script>
 </body>
 </html>
	<!--
	This file is meant to be hosted on a completely separate domain name
	from the LMS / frontend that is hosting the Open edX content (XBlocks).

	Doing so allows us to enable features like cookies in the sandboxed
	IFrame while keeping the XBlock content on a distinct origin, so that
	the XBlock cannot access user data from the host application (like
	cookies nor call APIs as the user).

	This particular sandboxing code uses the secure message passing API
	to request the XBlock HTML from the host application and then replaces
	its content with that HTML.
	-->
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	</head>
	<body>
	<script>
	const uniqueKeyPrefix = `k${+Date.now()}-${Math.floor(Math.random() * 1e10)}-`;
	var messageCount = 0;
	function postMessageToParent(messageData, callback) {
	const messageReplyKey = uniqueKeyPrefix + (messageCount++);
	messageData.replyKey = messageReplyKey;
	if (callback !== undefined) {
	const handleResponse = function (event) {
	if (event.source === window.parent && event.data.replyKey === messageReplyKey) {
	callback(event.data);
	window.removeEventListener('message', handleResponse);
	}
	};
	window.addEventListener('message', handleResponse);
	}
	window.parent.postMessage(messageData, '*');
	}
	// Request the HTML from the parent and then completely replace this entire
	// HTML document with the resulting HTML
	postMessageToParent({method: 'bootstrap'}, function(data) {
	document.open();
	document.write(data.initialHtml);
	document.close();
	});
	</script>
	</body>
	</html>