Displaying an HTML file with a JS inside an iPython notebook

Question

I have a piece of code in an iPython notebook that programmatically generates a folder named 'sound' containing the following files: index.html, canvas.js, graph.js and style.css.

If I open index.html in my browser, I can see exactly the output I want: a graph with a nice JS animation representing vectors in and out of a process I am modeling.

However, I would like to display the HTML file from inside the iPython notebook itself.

For that, I type the following code:

from IPython.display import IFrame
IFrame('/Users/useird/Desktop/sound/index.html', width=700, height=350)

Which returns the following:

I am not an expert with css or js, but I think that iPython can display js inside an iframe, so what's wrong here?

Thanks

Answer 1

To explicitly answer this question, I post my comment here again.

IPython uses the Tornado web server engine to serve the html pages. Per default, the web server cannot access files above the start directory. Otherwise, this would be a severe security exposure. Hence, to make your data available for the web server you have to place it in the notebook starting directory or in a subdirectory.

This applies not only to html pages, but also to images you want to display using tags.