Say I have a model Restaurant, and I want to upload an image and link it to the model. From documentation this should happen in two steps:

1. Create new entity
2. Upload and link image

Currently, after I create the entity and try to do step 2 it fails. Note: Image is obtained from React-Native image picker

Here is what I am doing:

      const data = new FormData();
      data.append('files', image.uri);
      data.append('refId', id);
      data.append('ref', 'Restaurants');
      data.append('field', 'Logo');

What I see is that the image is not uploaded. Furthermore, debugging from Strapi side, I see the request with all these data as fields.

I am using FormData as mentioned in the documentation, what am I missing?

Say I have a model Restaurant, and I want to upload an image and link it to the model. From documentation this should happen in two steps:

1. Create new entity
2. Upload and link image

Currently, after I create the entity and try to do step 2 it fails. Note: Image is obtained from React-Native image picker

Here is what I am doing:

      const data = new FormData();
      data.append('files', image.uri);
      data.append('refId', id);
      data.append('ref', 'Restaurants');
      data.append('field', 'Logo');

What I see is that the image is not uploaded. Furthermore, debugging from Strapi side, I see the request with all these data as fields.

I am using FormData as mentioned in the documentation, what am I missing?

• javascript
• react-native
• strapi

Share Improve this question Follow asked Jan 18, 2019 at 20:10 Mohamed MoanisMohamed Moanis 50777 silver badges1818 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

Turned out that I need to add some extra information to the files key so that FormData recongnize it as a file and Strapi can handle file upload. Here is what works:

      const data = new FormData();
      data.append('files', {
        uri: logo.uri,
        name: `test.jpg`,
        type: 'multipart/form-data'
      });
      data.append('refId', id);
      data.append('ref', 'Restaurants');
      data.append('field', 'Logo');

What matters really is the type: 'multipart/form-data.

One more remark, in the documentation, there is another key called source. I didn't use it and it seems not to affect anything. Note sure if it needed.