Serving an Iframe in Google Colab Notebook: localhost refused to connect

Question

I am trying to serve some HTML from a Google Colab notebook using the following:

from IPython.display import IFrame

IFrame(src='./output/index.html', width=700, height=600)

However, this throws localhost refused to connect:

Does anyone know how I can serve the html in index.html (which must load javascript) inside the Colab notebook? Any pointers would be hugely appreciated!

Answer 1

You can serve content from the path /nbextensions/ which maps to /usr/local/share/jupyter/nbextensions.

So you can put content there.

!ln -s /usr/local/share/jupyter/nbextensions /nbextensions
%cd /nbextensions
!wget -q https://upload.wikimedia.org/wikipedia/commons/3/37/Youtube.svg

Then serve the image

%%html
<img src=/nbextensions/Youtube.svg>

I can't make it works with IFrame, thought. I don't know why.

Here's an example colab notebook.