facebook / react-native

A framework for building native applications using React
https://reactnative.dev
MIT License
116.27k stars 23.99k forks source link

cannot get 304 Not modified status from fetch #44483

Open alvinlalbit opened 1 week ago

alvinlalbit commented 1 week ago

Description

I'm working on implementing a caching mechanism for images in a React Native application. This involves utilizing AWS S3 to store the image files and using JavaScript's fetch API to retrieve them. However, even after correctly adding the If-Modified-Since and If-None-Match headers in the fetch request, I'm facing an issue where the response.status property doesn't return a 304 status as expected.

Initially, I do receive the anticipated 304 response. However, upon modifying the If-None-Match in the headers, the subsequent response switches to 200, as anticipated. What's perplexing is that upon reverting the If-None-Match to its original value, all subsequent requests consistently return 200. Shouldn't the fetch API consistently return a 304 status?

I've extensively tested this behaviour across various HTTP clients, including Postman, cURL, and the fetch API in both browser and Node.js environments, all yielding 304 status always. Strangely, it seems that only the fetch API in React Native exhibits this behaviour.

Steps to reproduce

  1. Clone this repo
  2. run either npm run android or npm run ios , affects both platform
  3. see that the status code displayed in the console or in the text component in the screen will be 304 initially
  4. change something in the If-None-Match header
  5. see the status code in console or in the text, it will be 200
  6. change the If-None-Match back to its original value 2c845032f84e1139a41c639609406664, it will be 200
  7. it will be 200 from thereafter for that url

React Native Version

0.74.1

Affected Platforms

Runtime - Android, Runtime - iOS

Output of npx react-native info

info Fetching system and libraries information...
(node:16474) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
System:
  OS: macOS 14.0
  CPU: (8) arm64 Apple M2
  Memory: 138.47 MB / 8.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 21.7.3
    path: /opt/homebrew/bin/node
  Yarn: Not Found
  npm:
    version: 10.5.0
    path: /opt/homebrew/bin/npm
  Watchman:
    version: 2024.03.18.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.15.2
    path: /Users/bititude/.rbenv/shims/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.2
      - iOS 17.2
      - macOS 14.2
      - tvOS 17.2
      - visionOS 1.0
      - watchOS 10.2
  Android SDK: Not Found
IDEs:
  Android Studio: 2023.2 AI-232.10227.8.2321.11479570
  Xcode:
    version: 15.2/15C500b
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.10
    path: /usr/bin/javac
  Ruby:
    version: 2.7.5
    path: /Users/bititude/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react: Not Found
  react-native: Not Found
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Stacktrace or Logs

no stacktraces

Reproducer

https://github.com/alvinlalbit/react-native-cachetest

Screenshots and Videos

https://github.com/facebook/react-native/assets/108318273/accf4199-cbbd-46ae-8700-a61e5e5e1678