Description
Problem Description
Implement the crossOrigin property for Image in RNW Fabric when only source.uri is passed and not src/ srcSet.
For reference, check the public API documentation: https://reactnative.dev/docs/image#crossorigin
Implement the referrerPolicy property for Image in RNW Fabric when only source.uri is passed and not src/ srcSet.
For reference, check the public API documentation: https://reactnative.dev/docs/image#referrerpolicy
Also refer docs for source, src, srcSet
https://reactnative.dev/docs/image#source
https://reactnative.dev/docs/image#src
https://reactnative.dev/docs/image#srcset
It's not mentioned in the doc that when src / srcSet is missing then crossOrigin / referralPolicy would be ignored when source uri is a remote URL that is passed.
Currently these were ignored if src / srcSet was not passed and not added to sources headers.
This change adds headers support even without passing src / srcSet and only sources uri that consists of remote URL.
crossOrigin and referrerPolicy are passed as source.headers here:
Steps to reproduce
<Image
defaultSource={{uri: this.state.defaultImageUri}}
source={{uri: this.state.imageUri}}
crossOrigin="use-credentials"
referrerPolicy="no-referrer"
/>
Pass this in React Native and check source headers
React Native Version
0.78.0
Affected Platforms
Build - Windows, Build - MacOS, Runtime - Desktop, Runtime - Web, Runtime - iOS, Runtime - Android
Output of npx @react-native-community/cli info
info Fetching system and libraries information...
System:
OS: Windows 11 10.0.22631
CPU: (16) x64 Intel(R) Xeon(R) Platinum 8370C CPU @ 2.80GHz
Memory: 24.59 GB / 63.95 GB
Binaries:
Node:
version: 18.18.0
path: C:\Program Files\nodejs\node.EXE
Yarn:
version: 1.22.22
path: C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm:
version: 9.8.1
path: C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK:
AllowDevelopmentWithoutDevLicense: Enabled
AllowAllTrustedApps: Enabled
Versions:
- 10.0.17763.0
- 10.0.18362.0
- 10.0.19041.0
- 10.0.22000.0
- 10.0.22621.0
- 10.0.26100.0
IDEs:
Android Studio: Not Found
Visual Studio:
- 17.13.35828.75 (Visual Studio Enterprise 2022)
- 17.13.35828.75 (Visual Studio Community 2022)
Languages:
Java: Not Found
Ruby: Not Found
npmPackages:
"@react-native-community/cli": Not Found
react: Not Found
react-native: Not Found
react-native-windows: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: Not found
newArchEnabled: Not found
Stacktrace or Logs
info Fetching system and libraries information...
System:
OS: Windows 11 10.0.22631
CPU: (16) x64 Intel(R) Xeon(R) Platinum 8370C CPU @ 2.80GHz
Memory: 24.59 GB / 63.95 GB
Binaries:
Node:
version: 18.18.0
path: C:\Program Files\nodejs\node.EXE
Yarn:
version: 1.22.22
path: C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm:
version: 9.8.1
path: C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK:
AllowDevelopmentWithoutDevLicense: Enabled
AllowAllTrustedApps: Enabled
Versions:
- 10.0.17763.0
- 10.0.18362.0
- 10.0.19041.0
- 10.0.22000.0
- 10.0.22621.0
- 10.0.26100.0
IDEs:
Android Studio: Not Found
Visual Studio:
- 17.13.35828.75 (Visual Studio Enterprise 2022)
- 17.13.35828.75 (Visual Studio Community 2022)
Languages:
Java: Not Found
Ruby: Not Found
npmPackages:
"@react-native-community/cli": Not Found
react: Not Found
react-native: Not Found
react-native-windows: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: Not found
newArchEnabled: Not found
Reproducer
https://snack.expo.dev/L-KZaUnwFYfjVNb8cMxOh
Screenshots and Videos
No response