1

I'm using react-native-image-picker to select and upload images on server. It works great on android, but throws error on iOS. The npm link have provided a note that "On iOS, don't assume that the absolute uri returned will persist. See #107" what does it means? Will this library work on iOS? I'm trying with iOS simulator, it displays image properly but when I'm trying to upload on server using axios, it throws error "Missing request token for request: <NSURLRequest: 0x60000253e5a0> { URL: file://" like here Is there any other alternative react-native library to upload images with iOS and android?

shravan bardwa
  • 37
  • 2
  • 11
  • I used this one, https://github.com/ivpusic/react-native-image-crop-picker – anthony willis muñoz Sep 20 '20 at 10:13
  • Thanks anthony willis muñoz for pointing this. After struggling for 16hrs, I found that react-native-image-picker & react-native-image-crop-picker both cannot be used on iOS simulators. It works perfectly fine on real devices. – shravan bardwa Sep 21 '20 at 01:16

2 Answers2

0

If you are trying to upload a file to a server, react-native-image-picker & react-native-image-crop-picker will not work on iOS simulators. It will throw:

Missing request token for request: <NSURLRequest: 0x60000253e5a0> { URL: file://' error.

It works perfectly fine on real devices both android & ios. Just use a filename like this.

ImagePicker.openPicker({
  width: 300,
  height: 400,
  cropping: true,
  compressImageMaxHeight: 300,
  compressImageMaxWidth: 400,
  compressImageQuality: 0.5,
  mediaType: 'photo',
}).then(image => {
 
let filename = image.path.split('/').pop();
  
  let formData = new FormData();

  formData.append('file', {
    name: Platform.OS === 'android' ? filename : image.filename,
    type: image.mime,
    uri: image.path, 
  });
}
Raptor
  • 53,206
  • 45
  • 230
  • 366
shravan bardwa
  • 37
  • 2
  • 11
0

This is a internal error. Try it.

Go to node_modules/react-native/Image/RCTLocalAssetImageLoader.mm and change this lines to:

 - (RCTImageLoaderCancellationBlock)loadImageForURL:(NSURL *)imageURL
                                           size:(CGSize)size
                                          scale:(CGFloat)scale
                                     resizeMode:(RCTResizeMode)resizeMode
                                progressHandler:(RCTImageLoaderProgressBlock)progressHandler
                             partialLoadHandler:(RCTImageLoaderPartialLoadBlock)partialLoadHandler
                              completionHandler:(RCTImageLoaderCompletionBlock)completionHandler
 {
   __block auto cancelled = std::make_shared<std::atomic<bool>>(false);
   RCTExecuteOnMainQueue(^{
     if (cancelled->load()) {
       return;
     }

     UIImage *image = RCTImageFromLocalAssetURL(imageURL);
     if (image) {
       if (progressHandler) {
         progressHandler(1, 1);
       }
       completionHandler(nil, image);
     } else {
       NSString *message = [NSString stringWithFormat:@"Could not find image %@", imageURL];
       RCTLogWarn(@"%@", message);
       completionHandler(RCTErrorWithMessage(message), nil);
     }
   });

   return ^{
     cancelled->store(true);
   };
 }
Leonardo Leite
  • 101
  • 1
  • 2