Search code examples
reactjstypescripttensorflowmachine-learningtensorflow-lite

Can't load tflite custom model into web using react

I have 2 tflite models hosted as s3 objects on aws. In my react-typescript app, I am trying to load those models if the browser is opened on mobile. Else, the web app will use other more efficient models. enter image description here

The Models interface is as follows: enter image description here

I have configured the s3 bucket so I can access it from this web app, by changing the CORS configuration. That works. If I go to the network tabs, I see the fetch for the model:

enter image description here

Using Chrome, I can change from mobile to desktop display. The desktop display does not produce any errors. However, the mobile gives me errors that I do not understand.

enter image description here

Ignore the GET error and the date_created console.log. They are from another part of my code that is not relevant to this.

I have searched various resources for deploying a tflite to a web app, but have not found anything useful.

------------------EDIT-------------------

I have tried using the method discussed in this github post enter image description here

But only get the following error (you can ignore the GET error and isMobile console.log):

Solution

  • The solution is that the s3 objects were not uploaded correctly. The script that created the tflite model did not fully created the tflite models. It only created an empty file. I fixed the script. Here is the code that worked:

    import tensorflow as tf

model = tf.keras.models.load_model('model/R_keypoint_classifier_final.h5')
converter = tf.lite.TFLiteConverter.from_keras_model(model)
tflite_model = converter.convert()
r_file = open("tflite_models/R_converted_model.tflite", "wb")
r_file.write(tflite_model)

model = tf.keras.models.load_model('model/L_keypoint_classifier_final.h5')
converter = tf.lite.TFLiteConverter.from_keras_model(model)
tflite_model = converter.convert()
l_file = open("tflite_models/L_converted_model.tflite", "wb")
l_file.write(tflite_model)

    After that, I just added the files to the s3 bucket and used the code with the setWasmPath function.