Here is the function that isn't working:
def combine_html_files(input_file_paths, output_file_path):
html = '<!DOCTYPE html>
<html>
<body>
'
for i, file_path in enumerate(input_file_paths):
file = open(file_path, 'r')
file_data = file.read()
html += '{0}
<iframe id="{0}" srcdoc="{1}" width="810" height="260" frameborder="0"></iframe>
'.format(i, file_data)
html += '</body>
</html>
'
output_file = open(output_file_path, 'w')
output_file.write(html)
output_file.close()
It combines a list of HTML files into another HTML file where the contents of the file are in the srcdoc
attribute.
I have tried doing:
file_data = json.dumps(file.read())
- same as above:
file_data = json.dumps(file.read())
and removing the quotes around thesrcdoc
valuesrcdoc={1}
For reference, this simple static HTML file with just 1 element in srcdoc
works:
<!DOCTYPE html>
<html>
<body>
<h3>0</h3>
<iframe sandbox="allow-scripts" id="0" srcdoc="TEST 0
" width="810" height="260" frameborder="0"></iframe>
<h3>1</h3>
<iframe sandbox="allow-scripts" id="1" srcdoc="TEST 1
" width="810" height="260" frameborder="0"></iframe>
</body>
</html>
but once I try a more typical HTML file like this as the value for srcdoc
:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=visualization"></script>
<script type="text/javascript">
function initialize() {
var map = new google.maps.Map(document.getElementById("map_canvas"), {
zoom: 10,
center: new google.maps.LatLng(1.337046, 103.892634)
});
new google.maps.Circle({
strokeColor: '#F0F8FF',
strokeOpacity: 1.0,
strokeWeight: 1,
fillColor: '#F0F8FF',
});
}
</script>
</head>
<body style="margin:0px; padding:0px;" onload="initialize()">
<div id="map_canvas" style="width: 100%; height: 100%;" />
</body>
</html>
...then it fails. The page that loads just shows blank rectangles. I believe the issue is due to the string's encoding. Using the json.dumps
method inserted escape characters before quotation marks. However, it still isn't working.