CODEWITHSUNDEEP
react-nativefile-uploadfetchstrapi
DataCube
DataCube

Reputation: 107

How to upload photos with React Native

node v10.14.1 npm v6.4.1 strapi [email protected]

I'm trying to upload a picture taken with a "PhotoUpload" component to Strapi. Despite various tests, I get an error 500 from the server.

Insert_Files_Into_DataBase = () => {

const formdata = new FormData();
formdata.append("files:", this.state.image1); //Base64

this.setState(
  {
    ActivityIndicator_Loading: true
  },
  () => {
    fetch("" + NETWORK.SERVER_IP + ":1337/upload", {
      method: "POST",
      headers: {
        "Content-Type": "multipart/form-data",
        Authorization: "Bearer " + this.props.userToken.jwt
      },
      body: formdata
    })
      .then(response => response.json())
      .then(responseJsonFromServer => {
        alert(responseJsonFromServer + "Image1 OK!");
        this.setState({ ActivityIndicator_Loading: false });

      })
      .catch(error => {
        console.error(error);
        this.setState({ ActivityIndicator_Loading: false });
      });
  }
);
};

My "PhotoUpload" component allows me to retrieve the Base64 from the image. But it doesn't seem to work.

With Postman, everything works correctly

Upvotes: 0

Views: 1444

Answers (3)

DataCube
DataCube

Reputation: 107

I found a first mistake! I had simply forgotten the "HTTP://" in the address of my server.

Now, the server sends me back "true" but the image is not actually uploaded

Upvotes: 0

mediaguru
mediaguru

Reputation: 1917

Are you doing this on the iOS simulator? I find uploading only works for me on a real iOS device.

Upvotes: 1

Roshan Gautam
Roshan Gautam

Reputation: 510

In your code above, you are appending files: (with extra colon (:)). I think, you should append just files in the FormData() as:

formdata.append("files", this.state.image1); //Base64

This might be the case you are getting 500. If not also, you should append files instead of files:.

If this solves your problem, don't forget to hit upvote. :)

Upvotes: 0

Related Questions