Menu
I have spring boot app with cookie-based authentication and session management. For the first request I receive cookie names and session hashes as values.
On the other side, I have React Native app wrapped with Expo. For the first request ever made I can get this 'set-cookie' header from fetch() request. Then, even after restarting the app, I can't get this header.
I debugged it with React Native Debugger and with this line of code:
GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;
I can see my XHR requests on network tab in debugger. After cleaning all the cookies, every time I'm receiving properly set-cookie header in request's preview. But I can't see it with fetch(...).then(response => response.headers).
Why? It's something persisting my cookie? How to handle cookie data and save it to AsyncStorage without plugins/libraries?
954
You can pass HTTP headers to the fetch() request as the second parameter. For example, to pass the Bearer Token Authorization Header, call fetch() with the {headers: {Authentication: 'Bearer Token'}} parameter.
If you set credentials to same-origin : Fetch will send 1st party cookies to its own server. It will not send cookies to other domains or subdomains. If you set credentials to include : Fetch will continue to send 1st party cookies to its own server.
If you want to pass cookies with this request, you can do so by passing the credentials option to the fetch request. fetch("http://example.com/data.json", { credentials: "same-origin" }) . then(response => response. json()) .
React Native provides the Fetch API for your networking needs. Fetch will seem familiar if you have used XMLHttpRequest or other networking APIs before.
If you have Network Inspect enabled in React Native Debugger, turn it off. Right click anywhere on the Redux area and press Disable Network Inspect.
I know this is many years later, but I've found the culprit is React Native Debugger. If you have Network Inspect enabled, it strips the set-cookie header away, leaving you with an undefined.
Note that I am using Axios version 0.20.0 and have set withCredentials to true in my POST config, on React Native 0.63.3 with React Native Debugger 0.11.5. I know this is not fetch, but it's likely what's ailed you all those years ago. Your set-cookie disappeared the moment you started inspecting with RND.
The solution now is to disable Network Inspect, and you'll get your set-cookie again.
There is a bug opened in React Native Debugger in 2019, and the author has mentioned this is a limitation that is not easily overcome.
Read more here if you're interested:
https://github.com/jhen0409/react-native-debugger/issues/340#issuecomment-514395195
79
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
