在 Google Colab Notebook 中提供 iframe：localhost 拒绝连接答案

【问题标题】：Serving an Iframe in Google Colab Notebook: localhost refused to connect在 Google Colab Notebook 中提供 iframe：localhost 拒绝连接
【发布时间】：2020-03-24 06:36:37
【问题描述】：

我正在尝试使用以下内容从 Google Colab 笔记本中提供一些 HTML：

from IPython.display import IFrame

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

但是，这会抛出 localhost refused to connect:

有谁知道我如何在 Colab 笔记本中提供 index.html 中的 html（必须加载 javascript）？任何指针将不胜感激！

【问题讨论】：

标签： javascript iframe jupyter google-colaboratory

【解决方案1】：

您可以从映射到/usr/local/share/jupyter/nbextensions 的路径/nbextensions/ 提供内容。

所以你可以把内容放在那里。

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

然后提供图片

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

我不能让它与 IFrame 一起工作，我想。我不知道为什么。

这是一个例子colab notebook。

【讨论】：

2021-04-14T10:43 这不起作用。也许曾经有过一次，但不是今天。

【解决方案2】：

这个内置的示例笔记本提供了一个演示： https://colab.research.google.com/notebooks/snippets/advanced_outputs.ipynb#scrollTo=R8ZvCXC5A0wT

复制此处从后端提供内容的示例：

import portpicker
import threading
import socket
import IPython

from six.moves import socketserver
from six.moves import SimpleHTTPServer

class V6Server(socketserver.TCPServer):
  address_family = socket.AF_INET6

class Handler(SimpleHTTPServer.SimpleHTTPRequestHandler):
  def do_GET(self):
    self.send_response(200)
    # If the response should not be cached in the notebook for
    # offline access:
    # self.send_header('x-colab-notebook-cache-control', 'no-cache')
    self.end_headers()
    self.wfile.write(b'''
      document.querySelector('#output-area').appendChild(document.createTextNode('Script result!'));
    ''')

port = portpicker.pick_unused_port()

def server_entry():
    httpd = V6Server(('::', port), Handler)
    # Handle a single request then exit the thread.
    httpd.serve_forever()

thread = threading.Thread(target=server_entry)
thread.start()

# Display some HTML referencing the resource.
display(IPython.display.HTML('<script src="https://localhost:{port}/"></script>'.format(port=port)))

【讨论】：

感谢您。我承认我不确定它是如何用于为加载 js 资源的 html 提供服务的——我是否只需阅读我的 html 并将其传递给IPython.display.HTML() 函数？