Repository navigation
[iOS] Authorization header dropped when making HTTP requests that redirect #34627
Description
Description
I am requesting a URL of API service which responds with status code 307 (redirect) on success and a URL location in response Headers. This is protected API and needs Authorization header for it to be fulfilled successfully. The problem I am facing is that the Authorization header is not appended to the redirected URL, it is only appended to the original call, and therefore the redirected URL call fails with status 401. This works perfectly fine in Postman but is not working with Axios. This works fine in ReactJS web app and React Native mobile on Android OS, too. The problem is only on iOS platform. I have tried on a bare minimum RN app v.69.5 and v0.67.4 using axios and fetch API and the results on iOS platform are the same, so it clearly is problem on iOS platform with React Native. There is one more strange behaviour, it works fine on iOS, too, if I connect the app with react-native-debugger and inspect the network calls. So the problem is only on iOS platform with chrome debugger disabled. I have tried using maxRedirects: 0 prop and beforeRedirect callback on axios but to no avail.
Version
[0.67.4, 0.69.5]
Output of npx react-native info
info Fetching system and libraries information...
System:
OS: macOS 12.4
CPU: (8) arm64 Apple M1
Memory: 313.20 MB / 16.00 GB
Shell: 5.8.1 - /bin/zsh
Binaries:
Node: 16.13.0 - ~/.nvm/versions/node/v16.13.0/bin/node
Yarn: 1.22.17 - ~/.nvm/versions/node/v16.13.0/bin/yarn
npm: 8.1.4 - ~/.nvm/versions/node/v16.13.0/bin/npm
Watchman: Not Found
Managers:
CocoaPods: 1.11.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
Android SDK: Not Found
IDEs:
Android Studio: 2020.3 AI-203.7717.56.2031.7784292
Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
Languages:
Java: 12.0.2 - /usr/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 17.0.2 => 17.0.2
react-native: 0.67.4 => 0.67.4
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found
Steps to reproduce
npx react-native init sampleapp --version 0.69.5yarn add axios query-string- Add the imports on top:
import axios from 'axios';
import queryString from 'query-string';
- Place the following snippet in
App.jsfile:
const apply = async () => {
const url = `https://${baseUrl}/coupons/apply`;
const token = 'token';
const ins = axios.create({headers: {Authorization: token}});
const data = {
coupon: {
name: 'SufrExelBL',
},
],
};
const params = {
calculateTotal: true,
};
const headers = {
Authorization: token,
};
try {
const res = await ins.put(url, data, {
params,
paramsSerializer: function (params) {
return queryString.stringify(params);
},
headers,
});
console.log('SUCCESSSSSSSSSSSSSS', res);
} catch (e) {
console.log('ERORROOOOOORRRRRRRr', e);
}
};
useEffect(() => {
apply();
}, []);
- Note the catch block got executed with error 401 returned
Activity
github-actions commentedon Sep 8, 2022
react-native infoin a console.fawad-khalil-retailo commentedon Sep 8, 2022
Updated the react-native info output
fawad-khalil-retailo commentedon Sep 8, 2022
@hramos Please help
fawad-khalil-retailo commentedon Sep 8, 2022
I had tried building 0.70.0 as well to test it out but failed due to this harfbuzz/harfbuzzjs#34.
fawad-khalil-retailo commentedon Sep 8, 2022
It is a dup of #26311 but couldn't find its solution at that link.
raduciobanu22 commentedon Oct 19, 2022
Have the same issue when building on a Mac device with M1 chip. If instead I build the app on a Mac with Intel chip everything works.
yoovin commentedon Apr 6, 2023
Has anyone solved this issue in the m1 chip environment?
srascar-bubble commentedon Apr 17, 2023
Hello, @raduciobanu22 , not sure this is linked to m1. We faced the same issue on non m1 chip.
There is already an attempt to fix that issue https://github.com/facebook/react-native/blob/714b502b0c7a5f897432dbad388c02d3b75b4689/packages/react-native/Libraries/Network/RCTHTTPRequestHandler.mm#L145
However, this does not cover for
Authorizationheader. Furthermore, the request object received is already missing the original headers.Here is a patch that you can apply that reads the header from the original request.
Please note that this is based on
react-native@0.68.5Happy to open a PR since I think this should be fixed
8 remaining items
react-native-bot commentedon Jul 13, 2025
This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.
tom-sherman commentedon Jul 13, 2025
Not stale.
Touseef-ahmad commentedon Jul 13, 2025
I found that the issue only appears when the request doesn't end with a slash (/). Hope this helps.
tom-sherman commentedon Jul 13, 2025
@Touseef-ahmad that is likely because your server isn't redirecting in that case.
Sohail-suflon commentedon Nov 4, 2025
@shibatanien thnx it's work perfectly but we are fetch with id base then can't send the slash at the end
react-native-bot commentedon May 4, 2026
This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.
mduchev commentedon May 4, 2026
Still not stale
react-native-bot commentedon Nov 2, 2026
This issue is stale because it has been open 180 days with no activity. Remove stale label or comment or this will be closed in 7 days.
tom-sherman commentedon Nov 2, 2026
Not stale.