widgets.FileUpload() not working

Nope. I used paperspace for the first two lessons.

Thanks. I’ll do the same. I actually came to GCP from Paperspace because it was getting impossible to connect to Paperspace on to free GPUs when their servers get busy. .

Hi Inayat, how do you get to Jupyter Notebook from GCP’s AI Notebook GUI? Thanks so much.

This doesn’t work for me. I tried this:
jupyter labextension install @jupyter-widgets/jupyterlab-manager
and that doesn’t work either. I got the above from the ipywidgets documentation page https://ipywidgets.readthedocs.io/en/stable/user_install.html

Is anyone else running into this too?

1 Like

Also didn’t work for me.

1 Like

I am running my Juypter Notebooks directly on my server and not GCP.

I couldn’t find an answer to this on this forum, but an easy work-around is to upload your image(s) to the notebook’s /images dir, and then edit the code in cell #21, uploader = SimpleNamespace(data = ['images/your-filename-here'). Hope this helps.

2 Likes

Yeah, I’m running into lots of problems in FastAI so far. This is just one of them. The FileUpload() widget isn’t working for me either.

The Upload button shows up. I can click on it. I can browse for a file. I can select a file. The number in the Upload button increments. Then … nothing. It just does nothing. I can check the images directory through the terminal, and my file never gets uploaded. If I click the button again, it just makes me browse for another file and the counter increments. If I hit Shift Enter it just resets the counter. But no matter what I try, it never actually uploads anything.

I’m on Paperspace/Gradient, if that’s relevant.

I also tried
jupyter labextension install @jupyter-widgets/jupyterlab-manager
and
jupyter labextension install @jupyter-widgets/jupyterlab-manager@2.0
to no effect.

I guess I’ll try some other clunky workaround to get a file into that image folder…

Hey @Alexander77, if the counter is increasing, its actually uploading the files. The code provided by Jeremy in the next section shows you how to interact with the uploaded files.

Try this

btn_upload = widgets.FileUpload()
btn_upload

upload a file, then run:

img = PILImage.create(btn_upload.data[-1])

The above code will get the last uploaded image, hence the indexing -1 and create a PIL image from it.
Then run:

img.to_thumb(128,128)

to see if the image is displayed. Does this sequence of code work?

I was confused when using Colab at first but found that it did work. I assumed wrongly I would see my uploaded picture. You don’t, you need to go directly and run the prediction code.
If you do want to see your uploaded picture

replace the cell with:
\ For the book, we can’t actually click an upload button, so we fake it
uploader = SimpleNamespace(data = [‘images/chapter1_cat_example.jpg’])

With:
img = PILImage.create(uploader.data[0])
img.to_thumb(192)

When the image is uploaded it will display.

To go faster I also used this code which loads the images from Google drive (does not use upload button):

\ comment the first two lines after first run
from google.colab import drive
drive.mount(’/content/drive’)
%cd /content/drive/My\ Drive/
!pwd
uploader = SimpleNamespace(data = [‘your_img_folder/img_to_test.jpg’])
img = PILImage.create(uploader.data[0])
img.to_thumb(192)

The upload button also does not work for me, I followed the instruction as mentioned by jimmiemunyi above and Jeremy in notebook, and when pressing the button, I can see that my image seems loaded and the upload button is incremented by 1, but still the image does not show with img.to_thumb(128,128). I can manually type the image file as mentioned by another user, but it defeat the purpose of making it user friendly to upload new images, so I would like to resolve this problem.

I am using Jupiter notebook on JupyterLab on GCP, and Safari if this is useful info.

Appreciate any help!

1 Like

its me again…I experienced with the same notebook on Jupyter (instead of JupyterLab) and the widgets work! lots of time wasted, I do not know why it was not working on JupyterLab but remembered having seem some comments in the notes somewhere that some functions did not work on JupyterLab.

I hope this helps others,

2 Likes

I solved this on my Ubuntu Desktop machine (20.04 version) by installing the supposedly missing NODE.JS …as well as the before-mentioned ipywidgets via pip3.

Node.js definitely fixed the problem for me …it did require a restart. Good luck!

here’s a solution that worked for me in GCP Jupyter Lab, from jeffbiss

I’ve suffered all day with this problem. Button “uploadfile” has not appeared. Fortunately, I’ve found an issue. In my case it depended on the place where you creat your notebook. If you make it in fastai template, “uploadfile” will work but only in pythonlab. Otherwise it doesn’t work.

For Colab users, I found this solution. If you can upload an image but the code after that did not work. try to put # in front of this line of code: #uploader = SimpleNamespace(data = [‘images/chapter1_cat_example.jpg’])
this will disable the local image from being uploaded, and it will responded to the image that you actually uploading.

1 Like

IDE: Jupyter Notebook in the browser

Fix: Increase the websocket_max_message_size in your jupyter notebook config file.

Option 1: jupyter_notebook_config.py

Uncomment the following line:
c.NotebookApp.tornado_settings = {"websocket_max_message_size": 1073741824}

or

Options 2: jupyter_notebook_config.json

{
  "NotebookApp": {
    "tornado_settings": {
      "websocket_max_message_size": 1073741824
    },
  }
}

Source: Document workarounds for file upload size limit #2522


IDE: Visual Studio Code

The iPython ipywidget upload button is a known issue. There are quite a few issue trackers on the subject:

  1. FileUpload ipywidget returns empty dict #8084
  2. Extension host terminated uexpectedly when using ipywidgets.Fileupload #4525
  3. File upload widget crashes extension host when using non-jupyter (zmq) #10525

Workaround: Pass in the image path and name.

img_path = './images/'
img_file_name = 'cat-image.png'
img = img_path + img_file_name
is_cat, _, probs = learn.predict(img)

Note: Try not to let this issue slow you down. When you are ready to build your own app and want an upload button, you can address this issue in different ways.

2 Likes

I tried this solution with Colab, works like a charm.

My experience: I was making a very noob mistake using Google Colab trying to complete the testing of the cat/dog recognizer. I kept getting errors trying to run these cells getting errors like “No such file or directory: ‘images/chapter1_cat_example.jpg’” and “list index out of range”. My mistake was that every time I uploaded the image to the upload cell, I kept running the cell thinking that that was the way to save it. Uploading the image but not running the cell and then running the third cell (skipping the second cell used for when the first cell does not work) is what fixed this problem for me.

Hey everyone, new student here.

The PILImage.create() function requires the image we’re trying to upload. From the docs I read

    >>> import ipywidgets as widgets
    >>> uploader = widgets.FileUpload()

    # After displaying `uploader` and uploading a file:

    >>> uploader.value
    [
      {
        'name': 'example.txt',
        'type': 'text/plain',
        'size': 36,
        'last_modified': datetime.datetime(2020, 1, 9, 15, 58, 43, 321000, tzinfo=datetime.timezone.utc),
        'content': <memory at 0x10c1b37c8>
      }
    ]
    >>> uploader.value[0].content.tobytes()

That’s what we need to pass to PILImage.create(). Here’s the final code

def on_click_classify(change):
    img = fastbook.PILImage.create(btn_upload.value[0].content.tobytes())
    out_pl.clear_output()
    with out_pl: display(img.to_thumb(128,128))
    pred,pred_idx,probs = learn.predict(img)
    lbl_pred.value = f"Prediction: {pred}; Probability: {probs[pred_idx]:.04f}"