Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6290

Fetching a formData via React Native

$
0
0

I am writing a very dumb application using React Native / Flask but can't seem to be able to construct the formData. The formData.append function gives me this error:Argument of type '{ uri: any; type: string; name: string; }' is not assignable to parameter of type 'string | Blob'. Object literal may only specify known properties, and 'uri' does not exist in type 'Blob'.

This is how I'm fetching, the problem seems to be in the way the formDAta is being created, but I have tried pretty much everything and still doesn't work so I thought of asking here.

const ImagePickerScreen = () => {  const [image, setImage] = useState(null);  const pickImage = async () => {    // No permissions request is necessary for launching the image library    let result = await ImagePicker.launchImageLibraryAsync({      mediaTypes: ImagePicker.MediaTypeOptions.All,      allowsEditing: true,      aspect: [4, 3],      quality: 1,    });    console.log(result);    if (!result.canceled) {      setImage(result.assets[0].uri);    }  };  const handleIsHotdog = async () => {    if (!image) {      alert("No image selected");      return;    }    try {      const formData = new FormData();      formData.append('image', {        uri: image,        type: 'image/jpeg',        name: 'selectedImage.jpg'      });      const response = await fetch('http://my endopoint here', {        method: 'POST',        body: formData,        headers: {'Content-Type': 'multipart/form-data',        },      });      const responseJson = await response.text();      Alert.alert('Result',        responseJson,        [          { text: 'OK', onPress: () => console.log('OK Pressed') },        ],        { cancelable: false },      );    } catch (error) {      console.error(error);    }  };

And this is on the server-side:

@app.route("/process_image", methods=["POST"])def classify_image():    image = request.files["image"]    image = PIL.Image.open(image)    # Load the model    model = tf.keras.models.load_model('hotdog_model.h5')    # Preprocess the image    target_size = (224, 224)    image = image.resize(target_size)    image = tf.keras.preprocessing.image.img_to_array(image)    image = np.expand_dims(image, axis=0)    # Use the model to make a prediction    prediction = model.predict(image)    # Return the result    if prediction[0][0] > 0.5:        return "Hotdog"    else:        return "Not Hotdog"

The server works when I do postman request (using formdata.


Viewing all articles
Browse latest Browse all 6290

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>