How cookies are handled in react-native?

Question

I have a web app running with node js and passport.js and the authentication flow is working well. I'm trying to develop a react-native and to make the same authentication flow (with passport.js).

I changed the passport code to redirect back to the react-native app (with Linking) and it worked.

so the flow is:

Open browser with the login url (/auth/google)
User logged in
Redirected back to native app
send a request to verify the user is logged in - but the user is not logged in, I think because the cookies were not sent to the server

I also tried adding to the fetch credentials "same-origin" or "include" but still the user is not logged in.

Some code I used:

Linking.openURL("http://<my ip>:3000/auth/google"); //for log in

app.get('/auth/google/callback', //handle the log in with passport js
    passport.authenticate('google', {
        failureRedirect: '/login'
    }), function(req, res) {
        res.redirect('MyApp://login); // redirect back to native app
    });

fetch("http://<my ip>:3000/api1", {credentials: /*"same-origin"*/"include"}) //get 401 -> user is not logged in

Am I missing anything?

How cookies are handled in react-native? Is it like in the web? how the cookies should be passed from the browser to the native app after redirect?

Stackia Stackia · Accepted Answer · 2018-04-12T13:21:35

React Native is not browser environment. It doesn't automatically handle cookies like browsers.

You have to use some cookie-aware request library such as superagent.

Example usage (from superagent documentation):

const agent = request.agent();
agent
  .post('/login')
  .then(() => {
    return agent.get('/cookied-page');
  });

Then all requests from agent will handle cookies automatically (shares the same cookie jar).

How cookies are handled in react-native?

1 Answers