[Android] Image drops `source.headers` for a single-object source since 0.86 (only array sources forward headers)

Le bug se trouve dans Libraries/Image/Image.android.js. Commencez par lire la fonction render vers la ligne 300. La correction consiste à déstructurer headers depuis la source à objet unique et à les assigner à nativeProps.headers, en miroir de la branche pour les sources de type tableau. Testez en créant une application React Native minimale sur Android qui charge une image authentifiée, ou exécutez les tests Image existants pour vérifier que le changement fonctionne.

Description

Since React Native 0.86, <Image source={{uri, headers}} /> on Android no longer sends the headers with the image request when source is a single object. The headers are still forwarded when source is an array of sources.

Cause (Libraries/Image/Image.android.js, 0.86.3): in the render function the native headers prop is only set inside the if (Array.isArray(source_)) branch:

if (Array.isArray(source_)) {
  const {headers: sourceHeaders, width: sourceWidth, height: sourceHeight} = source_[0];
  if (sourceHeaders != null) {
    nativeProps.headers = sourceHeaders;
  }
  …
} else {
  const {uri, width: sourceWidth, height: sourceHeight} = source_;   // headers are dropped here
  …
  nativeProps.source = [source_];
}

The Android native view (ReactImageView) takes request headers only from the separate headers prop (ReactImageManager.setHeaders → ReactNetworkImageRequest.fromBuilderWithHeaders), not from the per-source entries, so the request is made without them. In 0.79 the prop was built as headers: source?.[0]?.headers || source?.headers, which covered both forms. iOS is not affected (headers are read from the source natively).

Real-world impact: every authenticated image (e.g. headers: {Authorization: 'Bearer …'}) silently fails with HTTP 401 on Android after upgrading to 0.86; onError reports Unexpected HTTP code Response{protocol=h2, code=401, …}.

Steps to reproduce

1. Render an image whose server requires a request header, single-object source:

   <Image source={{uri: 'https://example.com/protected.png', headers: {Authorization: 'Bearer <token>'}}} style={{width: 96, height: 96}} onError={e => console.log(e.nativeEvent.error)} />
   

2. On Android 0.86.x the request is sent without Authorization (server answers 401, onError fires, the image never loads).
3. The same element with an array source works: source={[{uri: '…', headers: {…}}]}.
4. On 0.79.x (and on iOS) both forms send the header.

React Native Version

0.86.3

Affected Platforms

Runtime - Android

Output of npx @react-native-community/cli info

System:
  OS: macOS 26.6.2
  CPU: (10) arm64 Apple M4
  Memory: 2.56 GB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 24.16.0
    path: /opt/homebrew/opt/node@24/bin/node
  Yarn:
    version: 4.16.0
    path: /opt/homebrew/opt/node@24/bin/yarn
  npm:
    version: 11.13.0
    path: /opt/homebrew/opt/node@24/bin/npm
  Watchman:
    version: 2026.06.01.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 27.0
      - iOS 27.0
      - macOS 27.0
      - tvOS 27.0
      - visionOS 27.0
      - watchOS 27.0
  Android SDK:
    API Levels:
      - "34"
      - "35"
      - "36"
      - "36"
    Build Tools:
      - 34.0.0
      - 35.0.0
      - 36.0.0
      - 36.1.0
      - 37.0.0
    System Images:
      - android-36 | Google APIs ARM 64 v8a
    Android NDK: Not Found
IDEs:
  Android Studio: 2026.1 AI-261.23567.138.2611.15503007
  Xcode:
    version: 27.0/27A266a
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.19
    path: /usr/bin/javac
  Ruby:
    version: 4.0.5
    path: /opt/homebrew/opt/ruby/bin/ruby

Stacktrace or Logs

[Image onError] Unexpected HTTP code Response{protocol=h2, code=401, message=, url=https://…/image?v=…}

(Replaying the exact URL with the same Authorization header via curl returns 200; the header simply is not attached by the Android image request.)

MANDATORY Reproducer

Minimal snippet above; the defect is a one-line omission in Libraries/Image/Image.android.js. Proposed fix (we run it as a patch-package patch on 0.86.3):

   } else {
-    const {uri, width: sourceWidth, height: sourceHeight} = source_;
+    const {
+      uri,
+      headers: sourceHeaders,
+      width: sourceWidth,
+      height: sourceHeight,
+    } = source_;
     if (uri === '') {
       console.warn('source.uri should not be an empty string');
     }
+    if (sourceHeaders != null) {
+      nativeProps.headers = sourceHeaders;
+    }

A harness that transpiles Image.android.js with @react-native/babel-preset, renders it with a mocked native component and asserts the headers prop for object and array sources fails on 0.86.3 and passes with the change; happy to open a PR with it if that helps.

Screenshots and Videos

Not needed: the image never loads (401), onError fires.