React Native上载图像到AWS Server不适用于Android [英] React Native upload image to AWS Server not working for Android

问题描述

尝试将图像从React Native上传到AWS Server时遇到问题.这是我的代码:

I was having some problem when trying to upload image from React Native to AWS Server. Here is my code:

async function uploadImageAsync(uri) {
  console.log(uri);
  let apiUrl = '...' 
  let uriParts = uri.split('.');
  let fileType = uri[uri.length - 1];
  let formData = new FormData();
  formData.append('image', {
    uri,
    name: `image.jpg`,
    filename: `image.jpg`,
  });

  let options = {
    method: 'POST',
    body: formData,
    headers: {
      Accept: 'application/json',
      'Content-Type': 'multipart/form-data',
    },
  };

  return fetch(apiUrl, options);
}

在控制台上打印出的结果是:

The results that printed out at the console are:

file:///data/user/0/host.exp.exponent/cache/ExperienceData/%2540gh%252Ftp2/ImagePicker/37c89140-2172-4566-98a2-e7393ea72e89.jpg
Object {
  "uploadResponse": undefined,
}
Object {
  "uploadResult": undefined,
}
Object {
  "e": [TypeError: Network request failed],
}

我所做的是我从图像选择器中选择一个图像，然后将其上传到AWS服务器.如果成功，则打印出成功消息.如果失败，请在上面的控制台中打印出来.

What I did is I pick an image from image picker, then I will upload it to AWS server. If success, print out success message. If failed, print out those in the console above.

奇怪的是，它设法在iOS上上传，但没有在Android上上传.任何想法为什么会这样?

The strange thing is, it managed to upload on iOS but not Android. Any ideas why is it so?

谢谢！

推荐答案

实际上，我遇到了此问题.您想使用提取"来上传文件(类型为mutipartfile)，但它始终显示[TypeError:网络请求失败].您可以参考此问题( https://github.com/facebook/react-native/Issues/28551 ).如果您使用的是RN0.62，请尝试一下.

In fact, I have encountered this problem. You want to use 'fetch' to upload file(the type is mutipartfile), but it always show [TypeError: Network request failed]. You can reference this issue(https://github.com/facebook/react-native/issues/28551). Have a try if you are using RN0.62.

以下是链接问题中github用户[ abumostafa ]的摘要.

Here is the summary from the github user [abumostafa] in the linked issue.

谁仍在为这个问题而苦苦挣扎.这是由于Flipper网络插件引起的. 我禁用了它，一切正常.

Whoever is still struggling with this issue. it's happening because of Flipper network plugin. I disabled it and things work just fine.

我要解决此问题的方法是注释掉第43行

My workaround to make this work is commenting out line number 43

38      NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin();
39      NetworkingModule.setCustomClientBuilder(
40          new NetworkingModule.CustomClientBuilder() {
41            @Override
42            public void apply(OkHttpClient.Builder builder) {
43      //        builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin));
44            }
45          });
46      client.addPlugin(networkFlipperPlugin);

在此文件android/app/src/debug/java/com/maxyride/app/drivers/ReactNativeFlipper.java

这篇关于React Native上载图像到AWS Server不适用于Android的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！