MultiValueDictKeyError при попытке отправить изображение из react-native в django

Я создаю свое первое приложение на react-native с бэкендом Django. Чтобы мое приложение работало правильно, мне нужно загрузить изображение из react-native в Django, а затем сохранить его в модели. Но когда я пытаюсь отправить изображение, я получаю "raise MultiValueDictKeyError(key) django.utils.datastructures.MultiValueDictKeyError: 'profileImage'."

вот мой код: frontend

const [ sentI, setSentI ] = useState(null)

const sendI = (image) => {
    const formData = new FormData()
    image_data = {
      uri : image.uri,
      name : "profileImage",
      type : 'image/jpg'
    }
    if (image != null){
      formData.append( 'profileImage', image_data,)
      setSentI(formData)
      console.log('recieved')
    }
    console.log(formData)
  }


  const showImagePicker = async () => {
    
    // Ask the user for the permission to access the media library 
    const permissionResult = await ImagePicker.requestMediaLibraryPermissionsAsync();

    if (permissionResult.granted === false) {
      alert("You've refused to allow this appp to access your photos!");
      return;
    }
    
    let result = await ImagePicker.launchImageLibraryAsync({
      mediaTypes: ImagePicker.MediaTypeOptions.All,
      allowsEditing: true,
      aspect: [4, 3],
      quality: 1,
    });

    // Explore the result
    console.log(result);

    if (!result.cancelled) {
      await setProfileImage(result);
      console.log(result.uri);
      sendI(result);
      
    }
  }

const image = () => {
    


    fetch(`http://192.168.5.234:8000/home/imagetest/`, {
      method: 'POST',
      body: {
        sentI
      }, 
  })
  .then( res => res.json())
  .then( res => {
    console.log(res)

  })
  .catch( error => console.log(error))

}

return (
    <View style={styles.scroll}>
        <ScrollView style={styles.scroll}>
      <Button onPress={showImagePicker} title="Select an image" />

      <View style={styles.imageContainer}>
        {
          profileImage !== null ? <Image
            source={{ uri: profileImage.uri }}
            style={styles.image}   
          />  
          :
          <Image style={styles.image}
            source={require('../assets/emptyProfile.png')}
          />

        }


      </View>
      </ScrollView>
      </View>
)

вот мой бэкенд

@csrf_exempt
def imagetest(request):
    if request.method == "POST":
        image = request.POST['profileImage']
        print(image)

Ошибка заключается в том, что в словарном объекте profileImage отсутствует ключевое слово request.POST.

В вашей javascript image-функции вы отправляете объектный литерал вместо самого объекта formData. Попробуйте изменить его на:

    fetch(`http://192.168.5.234:8000/home/imagetest/`, {
      method: 'POST',
      body: sentI,
    })

Я бы также предложил вам попробовать использовать request.POST.get("profileImage", False) в Django, как обсуждалось здесь: https://stackoverflow.com/a/5895670/6383431

Вернуться на верх