Is there a general way to run Web Applications on Google Colab?

问题

I would like to develop web apps in Google colab. The only issue is that you need a browser connected to local host to view the web app, but Google colab doesn't have a browser inside the notebook.

But it seems that there are ways around this. For example run_with_ngrok is a library for running flaks apps in colab/jupyter notebooks

https://github.com/gstaff/flask-ngrok#inside-jupyter--colab-notebooks

When you use it, it gives a random address , "Running on http://.ngrok.io"

And somehow the webapp that's running on Google colab is running on that address.

This is a great solution for Flask apps, but I am looking to run webapps in general on Google Colab, not just Flask ones. Is there a general method for running webapps in colab/jupyter notebooks?

回答1:

You can plan to start a server on a port, e.g. port=8000. Find the URL to use this way.

from google.colab.output import eval_js
print(eval_js("google.colab.kernel.proxyPort(8000)"))
# https://z4spb7cvssd-496ff2e9c6d22116-8000-colab.googleusercontent.com/

Then, start the server, e.g.

!python -m http.server 8000

And click the first link above (instead of localhost or 127.0.0.1)

Display in cell

You can display the result in an iframe in the output part. I made it into an easy function to call.

from IPython.display import Javascript

def show_port(port, height=400):
  display(Javascript("""
  (async ()=>{
    fm = document.createElement('iframe')
    fm.src = await google.colab.kernel.proxyPort(%s)
    fm.width = '95%%'
    fm.height = '%d'
    fm.frameBorder = 0
    document.body.append(fm)
  })();
  """ % (port, height) ))

Now you can start a webapp (here it is http.server) in a background. And display the result as an iframe below it.

get_ipython().system_raw('python3 -m http.server 8888 &') 
show_port(8888)

To stop the server, you can call ps and kill the process.

回答2:

Answer is found here

Launch a Dash app in a Google Colab Notebook

### Install ngrok
!wget https://bin.equinox.io/c/4VmDzA7iaHb/ngrok-stable-linux-amd64.zip
!unzip ngrok-stable-linux-amd64.zip

### Run ngrok to tunnel Dash app port 8050 to the outside world. 
### This command runs in the background.
get_ipython().system_raw('./ngrok http 8050 &')

### Get the public URL where you can access the Dash app. Copy this URL.
! curl -s http://localhost:4040/api/tunnels | python3 -c \
    "import sys, json; print(json.load(sys.stdin)['tunnels'][0]['public_url'])"

Then launch your webapp on port 8050

回答3:

Here is an example that illustrates starting a webserver and serving resources to a Colab output frame.

https://colab.research.google.com/notebooks/snippets/advanced_outputs.ipynb#scrollTo=R8ZvCXC5A0wT

Colab caches served outputs so that notebooks will render without reexecution. For live servers, users will need to reexecute the code to start the server. But, afterwards, Colab will proxy requests from the output frame that reference localhost to the Colab backend.

来源：https://stackoverflow.com/questions/59741453/is-there-a-general-way-to-run-web-applications-on-google-colab