fix fetch of content scheme urls failing on Android (#50122)

giantslogik · facebook-github-bot · commit 87c54a7ebab5 · 2025-04-24T12:39:58.000-07:00
Summary: This PR fixes #48762 - fix creating Blobs from Android 'content://' scheme urls was failing on the js side due to [this check](https://github.com/JakeChampion/fetch/blob/ba5cf1ed2e02ebb96fa1e60b4fd2eb04071b60e4/fetch.js#L547) ## Changelog: [ANDROID] [FIXED] - fix fetch of content scheme uris failing on Android. Pull Request resolved: #50122 Test Plan: Used the App here to test Android Blob creation. https://github.com/giantslogik/blob-large-file-fetch. EDIT: Added tester to RNTester Reviewed By: rshest Differential Revision: D73576300 Pulled By: javache fbshipit-source-id: 3fa5966aabd10d5fbe9f441948309c66e7113199
diff --git a/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/network/NetworkingModule.kt b/packages/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/network/NetworkingModule.kt
@@ -256,6 +256,10 @@ public class NetworkingModule(
       for (handler in uriHandlers) {
         if (handler.supports(uri, responseType)) {
           val res = handler.fetch(uri)
+          // fix: UriHandlers which are not using file:// scheme fail in whatwg-fetch at this line
+          // https://github.com/JakeChampion/fetch/blob/main/fetch.js#L547
+          ResponseUtil.onResponseReceived(
+              reactApplicationContext, requestId, 200, Arguments.createMap(), url)
           ResponseUtil.onDataReceived(reactApplicationContext, requestId, res)
           ResponseUtil.onRequestSuccess(reactApplicationContext, requestId)
           return
diff --git a/packages/react-native/ReactCommon/react/nativemodule/samples/platform/android/NativeSampleTurboModuleSpec.java b/packages/react-native/ReactCommon/react/nativemodule/samples/platform/android/NativeSampleTurboModuleSpec.java
@@ -141,4 +141,7 @@ public WritableMap getObjectAssert(ReadableMap arg) {
 
   @ReactMethod
   public void promiseAssert(Promise promise) {}
+
+  @ReactMethod
+  public void getImageUrl(Promise promise) {}
 }
diff --git a/packages/react-native/ReactCommon/react/nativemodule/samples/platform/android/ReactCommon/SampleTurboModuleSpec.cpp b/packages/react-native/ReactCommon/react/nativemodule/samples/platform/android/ReactCommon/SampleTurboModuleSpec.cpp
@@ -310,6 +310,24 @@ __hostFunction_NativeSampleTurboModuleSpecJSI_promiseAssert(
           cachedMethodId);
 }
 
+static facebook::jsi::Value
+__hostFunction_NativeSampleTurboModuleSpecJSI_getImageUrl(
+    facebook::jsi::Runtime& rt,
+    TurboModule& turboModule,
+    const facebook::jsi::Value* args,
+    size_t count) {
+  static jmethodID cachedMethodId = nullptr;
+  return static_cast<JavaTurboModule&>(turboModule)
+      .invokeJavaMethod(
+          rt,
+          PromiseKind,
+          "getImageUrl",
+          "(Lcom/facebook/react/bridge/Promise;)V",
+          args,
+          count,
+          cachedMethodId);
+}
+
 NativeSampleTurboModuleSpecJSI::NativeSampleTurboModuleSpecJSI(
     const JavaTurboModule::InitParams& params)
     : JavaTurboModule(params) {
@@ -351,6 +369,8 @@ NativeSampleTurboModuleSpecJSI::NativeSampleTurboModuleSpecJSI(
       1, __hostFunction_NativeSampleTurboModuleSpecJSI_getObjectAssert};
   methodMap_["promiseAssert"] = MethodMetadata{
       0, __hostFunction_NativeSampleTurboModuleSpecJSI_promiseAssert};
+  methodMap_["getImageUrl"] = MethodMetadata{
+      0, __hostFunction_NativeSampleTurboModuleSpecJSI_getImageUrl};
   eventEmitterMap_["onPress"] =
       std::make_shared<AsyncEventEmitter<folly::dynamic>>();
   eventEmitterMap_["onClick"] =
diff --git a/packages/react-native/ReactCommon/react/nativemodule/samples/platform/android/SampleTurboModule.kt b/packages/react-native/ReactCommon/react/nativemodule/samples/platform/android/SampleTurboModule.kt
@@ -7,9 +7,12 @@
 
 package com.facebook.fbreact.specs
 
+import android.net.Uri
 import android.os.Build
 import android.util.DisplayMetrics
 import android.widget.Toast
+import androidx.activity.ComponentActivity
+import androidx.activity.result.contract.ActivityResultContracts
 import com.facebook.proguard.annotations.DoNotStrip
 import com.facebook.react.bridge.Arguments
 import com.facebook.react.bridge.Callback
@@ -24,6 +27,7 @@ import com.facebook.react.bridge.WritableNativeMap
 import com.facebook.react.module.annotations.ReactModule
 import com.facebook.react.turbomodule.core.interfaces.BindingsInstallerHolder
 import com.facebook.react.turbomodule.core.interfaces.TurboModuleWithJSIBindings
+import java.util.UUID
 
 @DoNotStrip
 @ReactModule(name = SampleTurboModule.NAME)
@@ -172,7 +176,7 @@ public class SampleTurboModule(private val context: ReactApplicationContext) :
 
   @DoNotStrip
   @Suppress("unused")
-  override fun getValueWithPromise(error: Boolean, promise: Promise?) {
+  override fun getValueWithPromise(error: Boolean, promise: Promise) {
     if (error) {
       promise?.reject(
           "code 1", "intentional promise rejection", Throwable("promise intentionally rejected"))
@@ -189,13 +193,13 @@ public class SampleTurboModule(private val context: ReactApplicationContext) :
 
   @DoNotStrip
   @Suppress("unused")
-  override fun getObjectThrows(arg: ReadableMap?): WritableMap? {
+  override fun getObjectThrows(arg: ReadableMap): WritableMap {
     error("Intentional exception from JVM getObjectThrows with $arg")
   }
 
   @DoNotStrip
   @Suppress("unused")
-  override fun promiseThrows(promise: Promise?) {
+  override fun promiseThrows(promise: Promise) {
     error("Intentional exception from JVM promiseThrows")
   }
 
@@ -207,17 +211,40 @@ public class SampleTurboModule(private val context: ReactApplicationContext) :
 
   @DoNotStrip
   @Suppress("unused")
-  override fun getObjectAssert(arg: ReadableMap?): WritableMap? {
+  override fun getObjectAssert(arg: ReadableMap): WritableMap? {
     assert(false) { "Intentional assert from JVM getObjectAssert with $arg" }
     return null
   }
 
   @DoNotStrip
   @Suppress("unused")
-  override fun promiseAssert(promise: Promise?) {
+  override fun promiseAssert(promise: Promise) {
     assert(false) { "Intentional assert from JVM promiseAssert" }
   }
 
+  @DoNotStrip
+  @Suppress("unused")
+  override fun getImageUrl(promise: Promise) {
+    val activity = context.getCurrentActivity() as? ComponentActivity
+    if (activity != null) {
+      val key = UUID.randomUUID().toString()
+      activity.activityResultRegistry
+          .register(
+              key,
+              ActivityResultContracts.GetContent(),
+              { uri: Uri? ->
+                if (uri != null) {
+                  promise.resolve(uri.toString())
+                } else {
+                  promise.resolve(null)
+                }
+              })
+          .launch("image/*")
+    } else {
+      promise.reject("error", "Unable to obtain an image uri without current activity")
+    }
+  }
+
   private fun log(method: String, input: Any?, output: Any?) {
     toast?.cancel()
     val message = StringBuilder("Method :")
diff --git a/packages/react-native/src/private/specs_DEPRECATED/modules/NativeSampleTurboModule.js b/packages/react-native/src/private/specs_DEPRECATED/modules/NativeSampleTurboModule.js
@@ -59,6 +59,9 @@ export interface Spec extends TurboModule {
   +voidFuncAssert?: () => void;
   +getObjectAssert?: (arg: Object) => Object;
   +promiseAssert?: () => Promise<void>;
+
+  // Android-only
+  +getImageUrl?: () => Promise<string | null>;
 }
 
 export default (TurboModuleRegistry.getEnforcing<Spec>(
diff --git a/packages/rn-tester/js/examples/ContentURLAndroid/ContentURLAndroid.js b/packages/rn-tester/js/examples/ContentURLAndroid/ContentURLAndroid.js
@@ -0,0 +1,117 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @flow strict-local
+ */
+
+'use strict';
+
+import RNTesterBlock from '../../components/RNTesterBlock';
+import RNTesterPage from '../../components/RNTesterPage';
+import RNTesterText from '../../components/RNTesterText';
+import React from 'react';
+import {
+  Image,
+  Platform,
+  StyleSheet,
+  ToastAndroid,
+  TouchableOpacity,
+  View,
+} from 'react-native';
+import NativeSampleTurboModule from 'react-native/Libraries/TurboModule/samples/NativeSampleTurboModule';
+
+function blobToBase64(blob: Blob) {
+  return new Promise<string>((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onloadend = () => {
+      var result = reader.result;
+      if (typeof result === 'string') {
+        resolve(result);
+      } else {
+        reject('error: incompatible types');
+      }
+    };
+    reader.readAsDataURL(blob);
+  });
+}
+
+const ContentSelector = (): React.Node => {
+  const [base64Image, setBase64Image] = React.useState('');
+  const imageSelector = React.useCallback(async () => {
+    try {
+      const uri = await NativeSampleTurboModule.getImageUrl?.();
+      if (uri != null) {
+        console.log({uri});
+        const response = await fetch(uri);
+        const blob = await response.blob();
+        setBase64Image(await blobToBase64(blob));
+      }
+    } catch (e) {
+      ToastAndroid.show('' + e, ToastAndroid.LONG);
+    }
+  }, []);
+
+  return (
+    <>
+      <TouchableOpacity onPress={imageSelector}>
+        <View style={[styles.button, styles.buttonIntent]}>
+          <RNTesterText>Select Image</RNTesterText>
+        </View>
+      </TouchableOpacity>
+      {base64Image !== '' && (
+        <Image style={styles.image} source={{uri: base64Image}} />
+      )}
+    </>
+  );
+};
+
+class ContentURLAndroidExample extends React.Component<{}, {}> {
+  render(): React.Node {
+    return (
+      <RNTesterPage title={'fetch content:// scheme urls on Android as a Blob'}>
+        {Platform.OS === 'android' && (
+          <RNTesterBlock title="Content fetch">
+            <RNTesterText style={styles.textSeparator}>
+              Choose content to fetch.
+            </RNTesterText>
+            <ContentSelector />
+          </RNTesterBlock>
+        )}
+      </RNTesterPage>
+    );
+  }
+}
+
+const styles = StyleSheet.create({
+  textSeparator: {
+    paddingBottom: 8,
+  },
+  button: {
+    padding: 10,
+    backgroundColor: '#3B5998',
+    marginBottom: 10,
+  },
+  buttonIntent: {
+    backgroundColor: '#009688',
+  },
+  image: {
+    width: '100%',
+    resizeMode: 'cover',
+    height: '300',
+  },
+});
+
+exports.title = 'ContentURLAndroid';
+exports.description = 'Android specific fetch content:// scheme urls as blob.';
+exports.examples = [
+  {
+    title: 'fetch content:// urls as blob',
+    render(): React.MixedElement {
+      return <ContentURLAndroidExample />;
+    },
+  },
+];
diff --git a/packages/rn-tester/js/utils/RNTesterList.android.js b/packages/rn-tester/js/utils/RNTesterList.android.js
@@ -187,6 +187,11 @@ const APIs: Array<RNTesterModuleInfo> = ([
     category: 'Basic',
     module: require('../examples/AppState/AppStateExample'),
   },
+  {
+    key: 'ContentURLAndroid',
+    category: 'Android',
+    module: require('../examples/ContentURLAndroid/ContentURLAndroid'),
+  },
   {
     key: 'URLExample',
     category: 'Basic',

Original file line number	Diff line number	Diff line change
`@@ -141,4 +141,7 @@ public WritableMap getObjectAssert(ReadableMap arg) {`
`141`	`141`
`142`	`142`	`@ReactMethod`
`143`	`143`	`public void promiseAssert(Promise promise) {}`
	`144`	`+`
	`145`	`+ @ReactMethod`
	`146`	`+ public void getImageUrl(Promise promise) {}`
`144`	`147`	`}`
Original file line number	Diff line number	Diff line change
`@@ -59,6 +59,9 @@ export interface Spec extends TurboModule {`
`59`	`59`	`+voidFuncAssert?: () => void;`
`60`	`60`	`+getObjectAssert?: (arg: Object) => Object;`
`61`	`61`	`+promiseAssert?: () => Promise<void>;`
	`62`	`+`
	`63`	`+ // Android-only`
	`64`	`+ +getImageUrl?: () => Promise<string \| null>;`
`62`	`65`	`}`
`63`	`66`
`64`	`67`	`export default (TurboModuleRegistry.getEnforcing<Spec>(`