Fixing Tensorboard Plugins Not Loading on Safari
I’m planning to develop a customized plugin for Tensorboard. After downloading the official example plugin and installing it, I found it works on Chrome but only shows a white screen on Safari.
The console error message shows like this:
W1117 22:38:41.826974 13009694720 application.py:558] path /data/static/index.js not found, sending 404
It’s obviously caused by a path issue. On Chrome, when I click the plugin tag, it sends a request to:
But on Safari, it sends to the wrong path:
I searched the source code and suspect this line of code uses relative path, and may behave differently on Safari and Chrome:
module_json = json.dumps("." + module_path)
A Temporal Workaround
If we manually append the missing path in plugin.py, it works on Safari. But clearly, Chrome will fail because of the repeated path. Is there a way to make both browsers work?
Since now Chrome will request this file:
A workaround will be to copy the index.js file to this long address. Now, we have two copies of index.js, one serves for Safari and the other one serves for Chrome.
To let the installer copy the resource files in
plugin/... folder, we need to modify the
Otherwise, only the files in
static folder are copied and other files are still missing. We also need to make a copy of the
_serve_static_file function, and rename the new one with
_serve_static_file_chrome. Then, tell Tensorboard also to load files in the
Now let’s fix the file paths in the
def _serve_static_file_chrome(self, request):
_PLUGIN_DIRECTORY_PATH_PART_CHROME is defined as:
Build and run the plugin, it should work on both Safari and Chrome now. 🎉
PS: I also submitted an issue on Github. Let’s see if this can be confirmed as a bug.