2

I am using Jupyter and voila to serve notebook as dashboard. I am using ipyvuetify as the UI widget framework. ipyvuetify fetches some static files such as jupyter-vue.js from the internet This doesn't work with some of our users who have restricted Internet access. How can I ensure the static files are served from the App Server itself. Thanks

Gaurav Gogate
  • 21
  • 2
  • This might get more people in-the-know seeing it if you post it at [the Jupyter Community Discourse Forum](https://discourse.jupyter.org/)? If you do, please leave a pointer here and vice versa. – Wayne Oct 21 '22 at 18:13
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Community Oct 21 '22 at 18:59

1 Answers1

1

I have a similar setup. When your voila app starts, it at some point tries to locate the jupyter-vue.js component. Serving from localhost:8866 the first related request of your app is

GET http://localhost:8866/voila/jupyter-vue.js

which is then redirected to

GET http://localhost:8866/voila/files/voila/jupyter-vue.js

At this point your app cannot find jupyter-vue.js locally and it falls back to CDN

GET https://cdn.jsdelivr.net/npm/jupyter-vue@^1.8.0/dist/index.js

This is the point where your users need a connection to the CDN. To work around, you can download the js-components manually with a machine having internet connection.

$ curl https://cdn.jsdelivr.net/npm/jupyter-vue@^1.8.0/dist/index.js > jupyter-vue.js

you probably also want

$ curl https://cdn.jsdelivr.net/npm/jupyter-matplotlib@^0.11/dist/index.js > jupyter-matplotlib.js 
$ curl https://cdn.jsdelivr.net/npm/jupyter-vuetify@^1.8.4/dist/index.js > jupyter-vuetify.js

Put these file into a folder "voila" such that your notebook directory has the following setup

./notebooks/myapp.ipynb
./notebooks/voila/jupyter-vue.js
./notebooks/voila/jupyter-matplotlib.js
./notebooks/voila/jupyter-vuetify.js

Start your app

$ voila --VoilaConfiguration.file_whitelist=".*\.js" myapp.ipynb

Your app will now find the required components via the request

GET http://localhost:8866/voila/files/voila/jupyter-vue.js
pet52926
  • 11
  • 3