question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

File Upload via fetch

See original GitHub issue

How can I make file Upload work with react-native-document-picker:


DocumentPicker.show({
      filetype: [DocumentPickerUtil.allFiles()],
    }, (error, res) => {
     const { uri, type: mimeType, fileName } = res;

      const formData = new FormData();
      formData.append('file', { uri, type: mimeType, name: fileName });

      const config = {
            method: 'POST',
            headers: {Accept: 'application/json'},
            body: formData,
      };
      console.log(config);
      return fetch("/endpoint", config).then((response) => { console.log(response); response.json(); });

});

But get back that file is missing in upload on the server

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:11
  • Comments:6

github_iconTop GitHub Comments

1reaction
ionbaratolcommented, Dec 16, 2020

This works only for iOS, for Android you get a uri form the ContentProvider of type content:// which FormData can’t read

0reactions
zsubzwarycommented, Jun 11, 2019

@schmaluk you have no IDEA, you basically saved my life !!

Read more comments on GitHub >

github_iconTop Results From Across the Web

How do I upload a file with the JS fetch API? - Stack Overflow
I've done it like this: var input = document.querySelector('input[type="file"]') var data = new FormData() data.append('file', input.files[0]) ...
Read more >
How to upload a file using Fetch - Flavio Copes
How to upload files to the server using the Fetch API, explained in a simple way.
Read more >
How to upload files on the server using Fetch API
A step-by-step guide to upload upload files on server using JavaScript Fetch API. Example code snippets for handling server side requests ...
Read more >
How to easily upload files using Fetch API? - webinuse.com
JavaScript function to upload files ; const uploadFunction = event => { ; const files = event.target.files ; const data = new FormData()...
Read more >
Web Publishing with Fetch - Fetch Softworks
Uploading a file to your web server is as simple as clicking the Put button, or dragging the file's icon from the Finder....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found