Partage
  • Partager sur Facebook
  • Partager sur Twitter

upload image de react native à un backend via axio

    6 mai 2022 à 15:29:54

    bonjour

    je veux uploader une image de react native (avec expo) vers un backend symfony via axios.

    Voila le code front :

    const [pickedImage, setPickedImage] = useState("");
        const submitPhoto = async () => {
        try {
        const result = await ImagePicker.launchImageLibraryAsync();
        setPickedImage(result);
              
        let formData = new FormData();
              formData.append("uploaded_image", {
                uri:
                  Platform.OS === "android"
                    ? pickedImage.uri
                    : pickedImage.uri.replace("file://", ""),
                name: "tata.jpeg",
                type: "image/jpeg",
              });
              const response = await axios({
                method: "post",
                url: "http://192.168.1.3:8000/upload",
                data: formData,
              });
            } catch (error) {
              console.log(error)
            }
          };
    

    voila le code backend :

    public function postImage(Request $request)
    {
    //... some code
    $content = $request->files->get("uploaded_image");
    // ... handle the image in content
    }
    

    $content contient NULL, et je lai confirmé avec le profiler symfony 

    j'ai essayé d ajouter un "Content-type": "multipart/form-data" dans axios, mais j'ai le message : "Missing boundary in multipart/form-data POST data"

    Est ce que quelqun sait comment uploader l image ?

    Merci d avance


    -
    Edité par zskiredj 6 mai 2022 à 15:33:34

    • Partager sur Facebook
    • Partager sur Twitter
      17 mai 2022 à 17:20:59

      Comme je l'ai expliqué, quand j'utilise axios avec le bon header (multipart/form-data) j'obtiens le message d'erreur

      Missing boundary in multipart/form-data POST data

      J'ai essayé d'utiliser fetch, et ça marche maintenant !

      let response = await fetch(
              "http://192.168.1.3:8000/upload",
               {
                 method: "post",
                 body: formData,
                 headers : {
                   'Content-Type' : 'multipart/form-data;'
                 }
               }
            )
       


      c est bizarre, mais je ne sais pas pourquoi ça marche maintenant !
      • Partager sur Facebook
      • Partager sur Twitter

      upload image de react native à un backend via axio

      × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
      • Editeur
      • Markdown