react-native: Missing request token for request: { URL: file://

Description

I just upgraded to RN 0.63.0 and all fine, but only for upload using axios, i get

Missing request token for request: <NSURLRequest: 0x60000253e5a0> { URL: file:

image

React Native version:

System: OS: macOS 10.15.5 CPU: (4) x64 Intel® Core™ i5-7360U CPU @ 2.30GHz Memory: 163.19 MB / 8.00 GB Shell: 5.7.1 - /bin/zsh Binaries: Node: 12.16.1 - /usr/local/bin/node Yarn: 1.22.4 - /usr/local/bin/yarn npm: 6.13.4 - /usr/local/bin/npm Watchman: 4.9.0 - /usr/local/bin/watchman Managers: CocoaPods: 1.9.1 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2 Android SDK: API Levels: 22, 23, 25, 26, 27, 28, 29 Build Tools: 23.0.3, 27.0.3, 28.0.3, 29.0.0, 29.0.2 System Images: android-28 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom, android-R | Google APIs Intel x86 Atom Android NDK: Not Found IDEs: Android Studio: 4.0 AI-193.6911.18.40.6514223 Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild Languages: Java: 1.8.0_221 - /usr/bin/javac Python: 2.7.16 - /usr/bin/python npmPackages: @react-native-community/cli: Not Found react: 16.13.1 => 16.13.1 react-native: 0.63.0 => 0.63.0 npmGlobalPackages: react-native: Not Found

Steps To Reproduce

Here is my code snippet and that gives me error

  const cleanURL = body.imageData.uri.replace("file://", "");
  const data = new FormData();
  let fileName = body.imageData.fileName ? body.imageData.fileName : moment().unix()+'.jpg'
  data.append('file', {
    uri: cleanURL,
    name: fileName,
    type: body.imageData.type
  });
  data.append('fileName', fileName)
  return axiosclient.post(
    '/upload,
    data,
    {
      headers: {
        "content-type": "multipart/form-data"
      }
    }
  ).then(res => {
   
  }).catch(err => {
    
  })

Expected Results

Should upload file, it was fine in 0.62.2

About this issue

  • Original URL
  • State: closed
  • Created 4 years ago
  • Reactions: 60
  • Comments: 113 (14 by maintainers)

Commits related to this issue

Most upvoted comments

Here is a minimal repo that demonstrates this error. Choose a file from the camera roll and then try to retrieve that using fetch.

https://github.com/struct78/react-native-0.63.1-missing-request-token

@struct78 thanks for the repro!


Update:

I’ve identified the issue, in https://github.com/facebook/react-native/commit/31980094107ed37f8de70972dbcc319cc9a26339 I’ve broken the invariant that every [RCTImageURLLoader loadImageForURL] returns a request token.

Fix is under review.

For anyone else having this issue, as a temporary fix update your local file: node_modules/react-native/Libraries/Image/RCTLocalAssetImageLoader.mm and replace the Obj-C method shouldCacheLoadedImages with the following

- (BOOL)shouldCacheLoadedImages
{
  // UIImage imageNamed handles the caching automatically so we don't want
  // to add it to the image cache.
  return NO;
}

 - (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);
  };
}

dataForm.append(‘file’, { uri: Platform.OS==‘ios’?photo.uri.replace(“file://”, “/private”):photo.uri, name: ‘photo.jpg’, type: ‘image/jpg’ });

IOS : photo.uri.replace(“file://”, “/private”)

It only works for the real device, on simulator still give the error but at least you can deploy your app until this issue is patched

The main issue like someone mentioned is within RCTImageLoader.mm implementation:

- (id)sendRequest:(NSURLRequest *)request withDelegate:(id<RCTURLRequestDelegate>)delegate
{
  __block RCTImageLoaderCancellationBlock requestToken;
  requestToken = [self loadImageWithURLRequest:request callback:^(NSError *error, UIImage *image) {
    if (error) {
      [delegate URLRequest:requestToken didCompleteWithError:error];
      return;
    }

    NSString *mimeType = nil;
    NSData *imageData = nil;
    if (RCTImageHasAlpha(image.CGImage)) {
      mimeType = @"image/png";
      imageData = UIImagePNGRepresentation(image);
    } else {
      mimeType = @"image/jpeg";
      imageData = UIImageJPEGRepresentation(image, 1.0);
    }

    NSURLResponse *response = [[NSURLResponse alloc] initWithURL:request.URL
                                                        MIMEType:mimeType
                                           expectedContentLength:imageData.length
                                                textEncodingName:nil];

    [delegate URLRequest:requestToken didReceiveResponse:response];
    [delegate URLRequest:requestToken didReceiveData:imageData];
    [delegate URLRequest:requestToken didCompleteWithError:nil];
  }];

  return requestToken;
}

Error is thrown out because requestToken is nil. Like someone else has pointed out it is nil because completionBlock executes before requestToken is initialised. It happens because some image loader is performing task synchronously.

I’ve managed to fix issue for my project by reverting this commit: https://github.com/facebook/react-native/commit/31980094107ed37f8de70972dbcc319cc9a26339#diff-9a034658197479288c4d346a0eb4d98c

React Native 0.63.3 is available now. And in my local testing, this issue is now resolved. Thanks so much, all!

Hey, I caught up @helderburato and we tried some approaches. This seems an error not much related to token, even the error sending this message.

TL;DR: We do not manage to correct the issue. But we made some research, discovered something about it, created assumptions but for now, we are downgrading the version of our RN lib to 0.61.4. Here is what we managed to discover! 😄

Some steps to catch what we accomplish:

  • Added some logs at RCTNetworkTask.mm, method start():
- (void)start
{
  if (_status != RCTNetworkTaskPending) {
    RCTLogError(@"RCTNetworkTask was already started or completed");
    return;
  }

  if (_requestToken == nil) {
    id token = [_handler sendRequest:_request withDelegate:self];

    RCTLog(@"token %@", token); // <- here
    RCTLog(@"_handler %@", _handler); // <- here
    if ([self validateRequestToken:token]) {
      _selfReference = self;
      _status = RCTNetworkTaskInProgress;
    }
  }
}
  • Added some logs at RCTNetworkTask.mm, method validateRequestToken():
- (BOOL)validateRequestToken:(id)requestToken
{
  BOOL valid = YES;
  if (_requestToken == nil) {
    if (requestToken == nil) {
      if (RCT_DEBUG) {
        RCTLog(@"error _handler %@", _handler); // <- here
        RCTLog(@"error requestToken %@", requestToken); // <- here
        RCTLogError(@"Missing request token for request: %@", _request);
      }
      valid = NO;
    }
    _requestToken = requestToken;
  } else if (![requestToken isEqual:_requestToken]) {
    if (RCT_DEBUG) {
      RCTLogError(@"Unrecognized request token: %@ expected: %@", requestToken, _requestToken);
    }
    valid = NO;
  }
  /* ... */
}

Then I identified an issue with RCTImageLoader on calling the method sendRequest(). Then I went across the implementation inside the RCTImageLoader.mm file and added some logs inside of it. After discussing with an iOS developer friend (@Cherobin) that knows how Obj-C works, we created the assumption of the problem being the callback from requestToken not being fulfilled resulting in token being nil (null). This maybe happens because of how quick the code executes in comparison of how slow the callback is executed based on image size. We are reducing the image size with a JS lib before sending requests, so this happens with even a small size of images.

We tried to use a Semaphore but it seems not to resolve the issue. At the file RCTImageLoader we created some logs at sendRequest() and the following code is what we produced:

- (id)sendRequest:(NSURLRequest *)request withDelegate:(id<RCTURLRequestDelegate>)delegate
{
  // create the semaphore
  dispatch_semaphore_t sema = dispatch_semaphore_create(0);

  __block RCTImageLoaderCancellationBlock requestToken;
  requestToken = [self loadImageWithURLRequest:request callback:^(NSError *error, UIImage *image) {
    RCTLog(@"error %@", error); // <- log here
    if (error) {
      [delegate URLRequest:requestToken didCompleteWithError:error];
      return;
    }

    NSString *mimeType = nil;
    NSData *imageData = nil;
    if (RCTImageHasAlpha(image.CGImage)) {
      mimeType = @"image/png";
      imageData = UIImagePNGRepresentation(image);
    } else {
      mimeType = @"image/jpeg";
      imageData = UIImageJPEGRepresentation(image, 1.0);
    }
    RCTLog(@"mimeType %@", mimeType); // <- log here
    RCTLog(@"imageData %@", imageData); // <- log here

    NSURLResponse *response = [[NSURLResponse alloc] initWithURL:request.URL
                                                        MIMEType:mimeType
                                           expectedContentLength:imageData.length
                                                textEncodingName:nil];
    RCTLog(@"response %@", response); // <- log here

    [delegate URLRequest:requestToken didReceiveResponse:response];
    [delegate URLRequest:requestToken didReceiveData:imageData];
    [delegate URLRequest:requestToken didCompleteWithError:nil];
    RCTLog(@"delegate %@", delegate); // <- log here

    // Release the semaphore
    dispatch_semaphore_signal(sema);
  }];

  // Here we lock until the semaphore release
  if (![NSThread isMainThread]) {
      dispatch_semaphore_wait(sema, DISPATCH_TIME_FOREVER);
  } else {
      while (dispatch_semaphore_wait(sema, DISPATCH_TIME_NOW)) {
          [[NSRunLoop currentRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0]];
      }
  }

  RCTLog(@"RCTImageLoader requestToken %@", requestToken); // <- log here
  return requestToken;
}

Hope that helps someone! 😄

For now

npm i react-native@0.0.0-c3ab2a254 --save

If you want to lock a version (using latest nightly), but the podspecs are broken so you’ll have to edit

moishe-mobile-v2/node_modules/react-native/package.json

and change the version to “6.3.2” to be be able to install the pods until the make a fix for the nightlies.

Or if you want the latest build without any locking

npm i facebook/react-native.git#master --save

which the Podspecs dont break, but youre at the mercy of new bugs obviously each time you build. In my opinion these are the only two correct solutions, instead of trying to hack pieces of the package

in node_modules/react-native/Libraries/Image/RCTLocalAssetImageLoader.mm file

Replace Below

  • -(RCTImageLoaderCancellationBlock)loadImageForURL:(NSURL *)imageURL size:(CGSize)size scale:(CGFloat)scale resizeMode:(RCTResizeMode)resizeMode progressHandler:(RCTImageLoaderProgressBlock)progressHandler partialLoadHandler:(RCTImageLoaderPartialLoadBlock)partialLoadHandler completionHandler:(RCTImageLoaderCompletionBlock)completionHandler { 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 nil; }

With

  • -(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); }; }

This…

Like and Love , if it work 👍

Seem to still has the error in React-Native version 0.63.2. Plz help me… ExceptionsManager.js:179 Missing request token for request: <NSURLRequest: 0x6000019b3580> { URL: file:///Users/…/…/Data/Application/F880FB79-B4FB-40BB-9F34-2FAE72753A07/Documents/images/E4CC6AA6-895D-426C-97A6-B65EFE3360AB.jpg }

ExceptionsManager.js:179 Error processing request body: Error Domain=RCTErrorDomain Code=0 “Invalid request token.” UserInfo={NSLocalizedDescription=Invalid request token.}

Seem to still has the error in React-Native version 0.63.2.

Here is a minimal repo that demonstrates this error. Choose a file from the camera roll and then try to retrieve that using fetch.

https://github.com/struct78/react-native-0.63.1-missing-request-token

The issue is still here with 0.63.1, 100% reproducible on iOS. (tested with fetch and axios) The problem seems to come from loadImageWithURLRequest as mentioned here

Same issue on v0.63.2 npx react-native upgrade upgraded to v0.63.3 fixed the error.

There are workarounds in this thread (eg. reverting https://github.com/facebook/react-native/commit/31980094107ed37f8de70972dbcc319cc9a26339#diff-9a034658197479288c4d346a0eb4d98c by using patch-package). It takes like 5 minutes to do this so for everybody with this issue please do that and let’s monitor what the team is doing.

For sure if it’s gonna be fixed in the next version someone will mention this here.

@ajanauskas Looks promising, but unfortunately it didn’t change anything for me.

My patch looks like this
diff --git a/node_modules/react-native/Libraries/Image/RCTLocalAssetImageLoader.mm b/node_modules/react-native/Libraries/Image/RCTLocalAssetImageLoader.mm
index 8669ad3..7a55058 100644
--- a/node_modules/react-native/Libraries/Image/RCTLocalAssetImageLoader.mm
+++ b/node_modules/react-native/Libraries/Image/RCTLocalAssetImageLoader.mm
@@ -49,19 +49,28 @@ - (RCTImageLoaderCancellationBlock)loadImageForURL:(NSURL *)imageURL
                                  partialLoadHandler:(RCTImageLoaderPartialLoadBlock)partialLoadHandler
                                   completionHandler:(RCTImageLoaderCompletionBlock)completionHandler
 {
-  UIImage *image = RCTImageFromLocalAssetURL(imageURL);
-  if (image) {
-    if (progressHandler) {
-      progressHandler(1, 1);
+  __block auto cancelled = std::make_shared<std::atomic<bool>>(false);
+  RCTExecuteOnMainQueue(^{
+    if (cancelled->load()) {
+      return;
     }
-    completionHandler(nil, image);
-  } else {
-    NSString *message = [NSString stringWithFormat:@"Could not find image %@", imageURL];
-    RCTLogWarn(@"%@", message);
-    completionHandler(RCTErrorWithMessage(message), nil);
-  }

-  return nil;
+    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);
+  };
 }

 @end

Is that all that needs to be done?

upload form data image with axios fixed with v0.63.3

I was able to resolve this in two ways Either one can be used to resolve but both require to do some changes in node_modules/react-native/Libraries/Image A) https://github.com/facebook/react-native/pull/29595 Replace the - (id)sendRequest:(NSURLRequest *)request withDelegate:(id<RCTURLRequestDelegate>)delegate function in node_modules/react-native/Libraries/Image/RCTImageLoader.mm with below

- (id)sendRequest:(NSURLRequest *)request withDelegate:(id<RCTURLRequestDelegate>)delegate
{
  @synchronized(self) {
    __block RCTImageLoaderCancellationBlock requestToken = ^{};
    requestToken = [self loadImageWithURLRequest:request callback:^(NSError *error, UIImage *image) {
      @synchronized(self) {

        if (error) {
          [delegate URLRequest:requestToken didCompleteWithError:error];
          return;
        }

        NSString *mimeType = nil;
        NSData *imageData = nil;
        if (RCTImageHasAlpha(image.CGImage)) {
          mimeType = @"image/png";
          imageData = UIImagePNGRepresentation(image);
        } else {
          mimeType = @"image/jpeg";
          imageData = UIImageJPEGRepresentation(image, 1.0);
        }

        NSURLResponse *response = [[NSURLResponse alloc] initWithURL:request.URL
                                                            MIMEType:mimeType
                                               expectedContentLength:imageData.length
                                                    textEncodingName:nil];

        [delegate URLRequest:requestToken didReceiveResponse:response];
        [delegate URLRequest:requestToken didReceiveData:imageData];
        [delegate URLRequest:requestToken didCompleteWithError:nil];
      }
    }];

    return requestToken;
  }
}

B)https://stackoverflow.com/questions/54663887/missing-request-token-for-request

Replace the function loadImageForURL in /Libraries/Image/RCTLocalAssetImageLoader.mm with the following:

- (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);
  };
}

0.63.2 still exist

For those encountering this issue, I think I found a fix and have submitted a PR: https://github.com/facebook/react-native/pull/29595 The minimal line is to initialize requestToken by addint = ^{}; to sendRequest:withDelegate: in RCTImageLoader.mm on line 1044 approximately.

fixed the error

before i was fetching image.path and it was working just fine.

now u have to pass the sourceURL as the following

Screen Shot 2020-07-21 at 8 12 17 AM

Interesting. However, this doesn’t seem to have fixed it for me. Problem is only present on the simulator, no issue on an actual device. In addition, my simulator also freezes after accessing the image and requires a restart.

Same issue with axios after update to 0.63.1.

This problem only happens on the iOS (simulator/device).

Related issues: https://github.com/facebook/react-native/issues/28551 https://github.com/facebook/react-native/issues/29021

Same issue with axios after update to 0.63.0

Same issue with fetch for me when updating to 0.63.0.

Will it be fixed in the next version of RN?

Bringing together all the fixes here, hopefully we can get a fix for this merged to core soon:

iOS: Revert a PR, requires modifying node_modules: #29364 (comment), PR submitted here for the fix: #29595

Android: Upgrade Flipper version #28551 (comment)

I can confirm that both of these solutions worked for me. Earlier I said it didn’t work on iOS but I eventually found out why. Posting here in case anyone else has the same issue on React Native 0.63.2 (after making the above changes). Apparently my issue was that react-native-image-picker was not grabbing the file name on iOS. This didn’t happen on earlier versions, but apparently that’s what was preventing upload for me. For more context, I am using Node JS and Multer on my backend. Hope this helps someone.

Seems weird this hasn’t been resolved and released yet. No one using 0.63 can build an app that uploads files until then.

@caiangums , yup, that hack is a bad method, just a temporary hack to make it working. Still require react-native developer to provide a real fix for this issue.

Great! But is it available in the Expo RN version?

I also have same issue. I use hack for this #29021 (comment).

Nice temporary hack! It works in RN 0.63.2 I think we can do one more step.

copy the hacked RCTNetworkTask.mm into ios folder. create a script ‘runThisPodInstall.sh’ in ios folder with these content:

#!/bin/sh rm -rf *.xcworkspace rm -rf Pods/ cp -f RCTNetworkTask.mm …/node_modules/react-native/Libraries/Network/ pod install

chmod +x runThisPodInstall.sh everytime we remove the node_modules, wait for yarn install to be done, cd ios and ./runThisPodInstall.sh

For now npm i react-native@0.0.0-949dedca9 --save

is that work?

Hey all, after looking through the entire thread, it looks like this issue was resolved on master once @sammy-SC 's fix, ffc90c7f92e63e1a53ed107833e3deed492ab435 landed. That occurred on July 28.

The fix is not present in 0.63.2. Samuel already requested this fix to be cherry-picked into a 0.63.3 release, if there is one (see https://github.com/react-native-community/releases/issues/203#issuecomment-665754860).

Several workarounds have been shared on this thread, such as cherry-picking the fix, or reverting the offending commit, into your own React Native custom release. You may also consider downgrading, waiting for the next 0.64 release to be cut, or using a nightly build from after July 28 (see https://www.npmjs.com/package/react-native).

To discuss a 0.63.3 or 0.64.0 release, please use the appropriate release issue at https://github.com/react-native-community/releases/issues.

There is already a working fix and PR that has been sitting for weeks

In my opinion, fixing a library in node_modules is a bad solution and it should avoid as much as possible and it should be only the last chance to compile and launch the application.

In all other cases, it should be used a more stable solution (in this case, rn-fetch-blob).

Under normal circumstances, I would probably agree, but patch-package is a no brainer with how easy it is to add, plus it is a stable solution since it saves the patch script and applies it on install.

There is already a working fix and PR that has been sitting for weeks

Check out patch-package. It’s a very easy way to apply patches and when you update the component, it reminds you to update the patch – or if the bugs are fixed you can just delete the patch.

Facing this issue after upgrading RN to 0.63.2

Now I have encountered a new problem. The first upload is ok and the picture is displayed normally. After that, if I want to modify the picture, the second upload will have the same error

The main issue like someone mentioned is within RCTImageLoader.mm implementation:

- (id)sendRequest:(NSURLRequest *)request withDelegate:(id<RCTURLRequestDelegate>)delegate
{
  __block RCTImageLoaderCancellationBlock requestToken;
  requestToken = [self loadImageWithURLRequest:request callback:^(NSError *error, UIImage *image) {
    if (error) {
      [delegate URLRequest:requestToken didCompleteWithError:error];
      return;
    }

    NSString *mimeType = nil;
    NSData *imageData = nil;
    if (RCTImageHasAlpha(image.CGImage)) {
      mimeType = @"image/png";
      imageData = UIImagePNGRepresentation(image);
    } else {
      mimeType = @"image/jpeg";
      imageData = UIImageJPEGRepresentation(image, 1.0);
    }

    NSURLResponse *response = [[NSURLResponse alloc] initWithURL:request.URL
                                                        MIMEType:mimeType
                                           expectedContentLength:imageData.length
                                                textEncodingName:nil];

    [delegate URLRequest:requestToken didReceiveResponse:response];
    [delegate URLRequest:requestToken didReceiveData:imageData];
    [delegate URLRequest:requestToken didCompleteWithError:nil];
  }];

  return requestToken;
}

Error is thrown out because requestToken is nil. Like someone else has pointed out it is nil because completionBlock executes before requestToken is initialised. It happens because some image loader is performing task synchronously.

I’ve managed to fix issue for my project by reverting this commit: 3198009#diff-9a034658197479288c4d346a0eb4d98c

thank you bro, this is very work for me, rather than waiting for an update from react native that is very long

Good point @anthony1110! I think we all made some progress with our knowledge and maybe when someone from the RN team comes here they will have some ground on where to start.

btw does your “hack” generated side-effects? Did you notice something? 🤔

@caiangums , so far so good from my application to upload and download image with the hack. Again, it is still bad hack, still need to wait react-native developer to fix it. Also, I believe upgrade Flipper version will fix the issue but I am not sure how to upgrade Flipper version in IOS/podfile.

fixed the error

before i was fetching image.path and it was working just fine.

now u have to pass the sourceURL as the following

Screen Shot 2020-07-21 at 8 12 17 AM

Hey! Can you tell more about how you did it and deliver an example to reproduce it?

Simulator Screen Shot - iPhone Xʀ - 2020-07-20 at 01 25 28

i have the same issue RN 0.63.1 any updates ? !

it was just working fine before i upgrade to 0.63

Screen Shot 2020-07-20 at 1 28 54 AM

Error fixed when updating React Native to version 0.63.3

v0.63.3 axio / expo and react native i am still having problem request token in the upload of image formData IOS

Can also confirm that with RN 63.3 I am no longer seeing the issue.

There is already a working fix and PR that has been sitting for weeks

In my opinion, fixing a library in node_modules is a bad solution and it should avoid as much as possible and it should be only the last chance to compile and launch the application.

In all other cases, it should be used a more stable solution (in this case, rn-fetch-blob).

Bringing together all the fixes here, hopefully we can get a fix for this merged to core soon:

Using rn-fetch-blob does not require any fixes.

To temporarily correct this problem in CI, I added a post-installation to package.json, to run a script that replaces the RCTLocalAssetImageLoader.mm file in the node_modules folder. The file used for content replacement is the file quoted at https://github.com/facebook/react-native/issues/29364#issuecomment-670150318. In the file fix_ios.sh it has the command:

cat config/fix_ios/RCTLocalAssetImageLoader.mm > node_modules/react-native/Libraries/Image/RCTLocalAssetImageLoader.mm

in package.json postinstall looks like this:

… “scripts”: { “postinstall”: “sh ./fix_ios.sh”, …

None of these patching solutions seem to work on the latest version of React Native 0.63.2

For us #29364 (comment) did the trick. (RN 0.63.2)

Sorry, I should’ve been more clear. The token error goes away with that patch but still can’t upload the actual image. Might be related to Flipper/Network issues with the latest version of React Native (#29493) Also, I found this 2 liner patch that gets rid of the missing request token error instead of changing RCTLocalAssetImageLoader.mm here: #29021 (comment)

I read on another Issue about updating the Flipper version to lastest and that solve the issue with it. Just check if it’s your case! 😄

@caiangums I can confirm that in my case updating Flipper to 0.52.1 allowed me to upload but on Android only. I am experiencing this uploading issue on iOS. Is there a way to update Flipper’s version on iOS somehow? On React Native 0.63.2 they removed the FLIPPER_VERSION option in the Podfile. Perhaps it will be the same fix.

@SYNTAG Actually this thread is related to the iOS bug (sorry for mentioning Flipper). Sad that updating didn’t solve for you 😅 . Maybe you can try the option mentioned by @ssuchanowski (this one) or without Flipper 😄

@caiangums No problem! I appreciate you trying to help. And yes I’ve already made that change, and unfortunately it didn’t work for me. Crossing my fingers that we have a fix/solution coming soon.

None of these patching solutions seem to work on the latest version of React Native 0.63.2

@Monojitgit read the whole thread, it already provides couple of workarounds/solutions. (eg. reverting 3198009 by using patch-package)

For those encountering this issue, I think I found a fix and have submitted a PR: #29595 The minimal line is to initialize requestToken by addint = ^{}; to sendRequest:withDelegate: in RCTImageLoader.mm on line 1044 approximately.

this seems to be working just replacing line __block RCTImageLoaderCancellationBlock requestToken; with __block RCTImageLoaderCancellationBlock requestToken = ^{}; fixed the issue.

You could use patch-package to run as a post install step. That’s what I’ve done

@mrprkr do you know which version was last to work?

0.62 worked with no issues

@osikes Yep, this is actually pretty ridiculous. The patch doesn’t seem to work on my CI either and couldn’t roll back to 62 without breaking changes. Now stuck not able to release an app version until an update is available.

@keithhackbarth The original issue and error information added to this issue seems pretty iOS specific. If you’re seeing something similar on android i’d suggest opening a separate issue.

Worth noting that the above fix only works on iOS and similar issue appears to exist on Android

fixed the error before i was fetching image.path and it was working just fine. now u have to pass the sourceURL as the following Screen Shot 2020-07-21 at 8 12 17 AM

Hey! Can you tell more about how you did it and deliver an example to reproduce it?

find the comment below #29364 (comment)

also i can confirm that my solution worked on ios but not on android. so weird

Hey @uusa35, thanks for your reply. My request is for an example to reproduce. As far as I can see, your comment just has some prints from your code and it was traced that the issue may be related to some bug inside the Objective-C RN lib.

Just to be clear:

  • “Works on my machine” is not a good reply in any case (I tested your solution on my code and still not work)
  • “An example to reproduce it” by far is not prints from your code. @struct78 gave an example with a repo and this is a real example to reproduce it
  • The thread has some other information about it. If possible, maybe you can check it out. As an example, @anthony1110 found a way to avoid the issue modifying the RN source code directly and it worked but he already said this is a “hack” and is better to wait until someone from RN team(or anyone with more knowledge in Obj-C background) catch-up and fix the issue

fixed the error before i was fetching image.path and it was working just fine. now u have to pass the sourceURL as the following Screen Shot 2020-07-21 at 8 12 17 AM

Hey! Can you tell more about how you did it and deliver an example to reproduce it?

find the comment below https://github.com/facebook/react-native/issues/29364#issuecomment-660718932

also i can confirm that my solution worked on ios but not on android. so weird