显示上传图像的 React Native 奇怪的 android 行为

Question

我们正在使用 React Native 和 react-native-image-picker 库构建一个应用程序。

我将从我们现在的行为开始： （在 Android 设备上）上传图像选择器库选择的图像（个人资料图像）时，一切顺利。 在返回个人资料页面的请求之后，我们刚刚上传的图像没有被加载。重新启动/构建/清除缓存无法解决问题。

在同一帐户上查看我的 iOS 模拟器/Android 模拟器时，我确实看到了从设备上传的图像。

tl:dr 我从安卓设备上传了一张图片，（上传正确，可以在浏览器中看到）在同一台设备上看不到，但我可以在其他设备/模拟器上看到。

我不知道发生了什么，希望得到一个快速的答案，因为问题是延迟发布。

这是我从图像选择器中获取图像的地方。

ImagePicker.showImagePicker(options, (response) => {
  if (response.error) {
    this.props.setError(I18n.t('editProfile.fields.profileImage.error'));
  } else if (!response.didCancel) {
    if (Platform.OS === 'ios') {
      const image = {
        uri: response.uri.replace('file://', ''),
        filename: 'ProfileImage',
        height: response.height,
        isStored: false,
        width: response.width,
      };

      this.props.onSubmit(image);
    } else {
      const image = {
        uri: response.path,
        filename: 'ProfileImage',
        height: response.height,
        isStored: true,
        width: response.width,
      };

      this.props.onSubmit(image);
    }
  }
});

注意：此功能在 iOS 上完美运行。

Answer 1

我在使用 AWS S3 时遇到了类似的问题，但在我的情况下，问题是没有设置内容类型/mime 类型。我不得不手动设置它。

这是我的代码的一部分：

s3 = new AWS.S3();

      var extension = ".jpg";
      if (img.mime.indexOf(".png") > -1)
        extension = ".png";

      var key = "Reports/" + req.body.id + "/" + date.getTime() + "/Image" + extension;

      var buf = new Buffer(img.data,'base64');

      var params = {
        Bucket: 'XXXXXXXXXXXXX',
        Key: key,
        Body: buf,
        ContentEncoding: 'base64',
        ContentType: img.mime,
        ACL: 'public-read'
      };

      console.log("S3 Start");
      var upload = s3.upload(params, function(err,data) {
        if (err) {
          console.log(err, err.stack);
        } else {
          console.log(data);
          s3Url = data.Location;
        }

Answer 2

问题是根据上传的图片引起的。 旧的安卓设备似乎有问题。