g6ling / react-native-tips Goto Github PK

Hi! Just uploaded a sample repo here https://github.com/mgscreativa/React-Native-Upload-Files-to-Meteor-Server

I tried uploading the image to the PHP server but it's not working although I was able to upload normal String but getting the issue in image uploading
need help

implemented the same

if (evt.lengthComputable) { progressFun((evt.loaded / evt.total) * 100); const progress = (evt.loaded / evt.total) * 100; console.log('progress123', progress, evt.loaded, evt.total); //percentageDiv.innerHTML = Math.round(evt.loaded / evt.total * 100) + "%"; }

i use this exact same code

const data = new FormData(); data.append('name', 'testName'); // you can append anyone. data.append('photo', { uri: photo.uri, type: 'image/jpeg', // or photo.type name: 'testPhotoName' }); fetch(url, { method: 'post', body: data }).then(res => { console.log(res) });

it work on ios and Android
But i have problem with the exif /metadata part. on Android the uploaded picture contain the exif but not on IOS.

is some one getting this error ?

In the description you use photo/image as an example, but if the file is pdf or doc how can I get the URI?

After succesfully trying configuring fetch to upload images on android/ios/web, I wanted to test futch,

However, it does not work, this is how my code looks like, I just replace fetch, with futch:

const res = await futch(url, requestOptions);
alert(res.status);

alert will display {"isTrusted":true}, I expected 200.

I have tried to add withCredentials = true to support CORS, but that didn't help.

This is futch.js:

const futch = (url, options = {}, onProgress) => new Promise((res, rej) => {
  const xhr = new XMLHttpRequest();
  xhr.withCredentials = true;
  xhr.open(options.method || 'get', url);
  for (const k in options.headers||{})
    xhr.setRequestHeader(k, options.headers[k]);
  // Object.keys(opts.headers || {}).forEach((key) => {
  //   xhr.setRequestHeader(key, opts.headers[key]);
  // });
  xhr.onload = (e) => res(e.target);
  xhr.onerror = rej;
  if (xhr.upload && onProgress) {
    xhr.upload.onprogress = onProgress;
  }
  xhr.send(options.body);
});
export default futch;

• Any idea why?
• How can I get the progress in React native ?

Hi
is this correct? where does opts come from?

const photos = [photo1, photo2, ...]
photos.forEach((photo) => {
    data.append('photo', {
    uri: photo.uri,
    type: 'image/jpeg', // or photo.type
    name: photos.name
  });  
});
fetch(url, opts);

should it be data?
thanks

Hi, I was wondering how to to the same thing in typescript. I get an error with this line:

data.append('photo', {
  uri: photo.uri,
  type: 'image/jpeg', 
  name: 'testPhotoName'
});

Because of a type mismatch:

Argument of type '{ uri: string; name: string; type: string; }' is not assignable to parameter of type 'string | Blob'.
  Object literal may only specify known properties, and 'uri' does not exist in type 'string | Blob'.

The documentation of FormData.append looks nothing like the code described above. Does anybody have an idea how to solve this?