'Jupyter display HTML file inside HTML file

I want to display an HTML file that will reference another HTML file in the jupyter notebook, but it always shows me nothing.

enter image description here

Jupyter server logs in the below, and it seems like that server can get the file but failed to display it in the notebook.

[I 02:03:50.913 NotebookApp] 302 GET /notebooks/jupyter/46d2a8592dea2144603db52b9e9ee88d/input.html (::1) 1.020000ms
[I 02:03:50.970 NotebookApp] 302 GET /files/jupyter/46d2a8592dea2144603db52b9e9ee88d/output.html (::1) 0.480000ms
[W 02:03:51.020 NotebookApp] Forbidden
[W 02:03:51.021 NotebookApp] 403 POST /api/security/csp-report (::1) 0.680000ms referer=None
from IPython.display import HTML, IFrame, display
iframe = f'<iframe src="default.html" width=100% height=400></iframe> '
display(HTML(iframe))

The content of default.html is like below:

<iframe src="output.html" width=100% height=400></iframe>

How do I successfully load another HTML file inside my jupyter notebook?



Solution 1:[1]

Be sure you have a good online site for testing with.

This works for me in both the classic Jupyter notebook interface and in JupyterLab (Version 3.2.8) served via MyBinder.org (launch by clicking here) just now:

import IPython
url = "https://jupyter.org"
iframe = '<iframe src=' + url + ' width=700 height=350></iframe>'
IPython.display.HTML(iframe)

It'll complain about the syntax for now yet still works.

Your code works with that site (and doesn't complain):

from IPython.display import HTML, IFrame, display
iframe = f'<iframe src="https://jupyter.org" width=100% height=400></iframe> '
display(HTML(iframe))

If you are seeing an issue with accessing a local file then that isn't a problem with Jupyter. It is a browser security issue. Browsers don't allow that for security concerns, see abdusco's comment here and here.
I don't know if adding the --allow-file-access-from-file flag is possible since you don't provide how you launch your notebook or mention what browser you are using?



A simpler variation presently works in the classic notebook interface , not JupyterLab:

from IPython.display import IFrame; IFrame('http://jupyter.org', width='100%', height=350)

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