upload file, picked by ImagePicker to Loopback (node.js) server

#1

Hi! I have created endpoint "uploads’ and tested it with Postman. It works, files appears on the server, and postman shows relevant response with status 200 and body with uploaded files info.

But when I try to post data from my client app (react-native), server sends and error

Unhandled error for request POST /api/uploads/zayavka1/upload?access_token=GAxRixBW5oT3ayErF3IaWqd7zpSpBSsKED3IylR43La7jpbn4uRgKEDK90u7H3P7: Error: No file content uploaded
    at /home/rus/dobrofon-backend/node_modules/loopback-component-storage/lib/storage-handler.js:204:13
    at IncomingForm.<anonymous> (/home/rus/dobrofon-backend/node_modules/formidable/lib/incoming_form.js:107:9)
    at emitNone (events.js:105:13)
    at IncomingForm.emit (events.js:207:7)
    at IncomingForm._maybeEnd (/home/rus/dobrofon-backend/node_modules/formidable/lib/incoming_form.js:557:8)
    at MultipartParser.parser.onEnd (/home/rus/dobrofon-backend/node_modules/formidable/lib/incoming_form.js:426:10)
    at callback (/home/rus/dobrofon-backend/node_modules/formidable/lib/multipart_parser.js:102:31)
    at MultipartParser.write (/home/rus/dobrofon-backend/node_modules/formidable/lib/multipart_parser.js:268:15)
    at IncomingForm.write (/home/rus/dobrofon-backend/node_modules/formidable/lib/incoming_form.js:159:34)
    at IncomingMessage.<anonymous> (/home/rus/dobrofon-backend/node_modules/formidable/lib/incoming_form.js:125:12)
    at emitOne (events.js:115:13)
    at IncomingMessage.emit (events.js:210:7)
    at IncomingMessage.Readable.read (_stream_readable.js:478:10)
    at flow (_stream_readable.js:849:34)
    at resume_ (_stream_readable.js:831:3)
    at _combinedTickCallback (internal/process/next_tick.js:138:11)

And this is my request from client:

  fetch(path, {
    method: 'POST',
    headers: {
      Accept: '*/*',
      'Content-Type': 'multipart/form-data'
    },
    body: formData
  })

And formData looks like:

{
"_parts": Array [
     Array [
       "file[]",
       "file:///data/data/host.exp.exponent/cache/ExperienceData/%2540anonymous%252Freact-native-nav-tutorial-7bcb8d09-73d3-4f7f-87a6-a75e9d9ad295/ImagePicker/09648b04-d674-444c-82d7-c5c50e57726c.jpg",
     ],
   ],
 }

My env info:

{
    "expo": "^27.0.1",
    "native-base": "^2.4.4",
    "react": "16.3.1",
    "react-native": "~0.55.2",
    "react-navigation": "^2.0.1"
  }
$ node -e 'console.log(process.platform, process.arch, process.versions.node)'
linux x64 8.5.0
$ npm ls --prod --depth 0 | grep loopback
├── loopback@3.19.1
├── loopback-boot@2.27.1
├── loopback-component-explorer@6.0.1
├── loopback-component-storage@3.3.1
├── loopback-connector-mongodb@3.4.3
rus@ubuntu16:~/dobrofon-backend$

I tried many things, but I can’t figure out what I do wrong. I didn’t find any examples with using fetch and loopback-storage (only xhr and angular).

Please, share some ideas about it.

0 Likes

closed #2

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.

0 Likes