Question

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

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

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

tl：dr我从Android设备上传了一张图片，（正确上传，可以在浏览器中看到它）无法在同一设备上看到它，但我可以在其他设备/模拟器上看到它。

我不知道发生了什么事，因为问题是延迟发布，所以我会喜欢快速回答。

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

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上遇到了类似的问题但在我的情况下问题是没有设置content-type / 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

问题是根据上传的图像引起的。旧的Android设备似乎有问题。

React Native Weird安卓系统显示上传的图片

2 个答案: