New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Automatic cookies #1274

Closed
cloud8421 opened this Issue May 14, 2015 · 24 comments

Comments

Projects
None yet
@cloud8421

cloud8421 commented May 14, 2015

Please feel free to correct me.

I've tried to use the fetch api to login against a service which sets a cookie in case of success.

The session cookie gets correctly set and subsequent requests to the same service pass authentication without me configuring anything at the code level, which makes me assume that cookies are automatically managed by the JavascriptCore runtime.

I can't find a way to manipulate them though, is that by design?

As a side note, does this mean that I'm just better off using a different authentication flow?

Thanks for your work on this!

@nicklockwood

This comment has been minimized.

Show comment
Hide comment
@nicklockwood

nicklockwood May 15, 2015

Contributor

They're automatically managed by the Objective-C network stack, which is used internally by fetch. We haven't exposed any explicit support for them though. This would need to be implemented as a native "RCTCookieJar" module.

Contributor

nicklockwood commented May 15, 2015

They're automatically managed by the Objective-C network stack, which is used internally by fetch. We haven't exposed any explicit support for them though. This would need to be implemented as a native "RCTCookieJar" module.

@cloud8421

This comment has been minimized.

Show comment
Hide comment
@cloud8421

cloud8421 May 15, 2015

Thanks for the clarification, I'll keep it in mind.

cloud8421 commented May 15, 2015

Thanks for the clarification, I'll keep it in mind.

@cloud8421 cloud8421 closed this May 15, 2015

@bakso

This comment has been minimized.

Show comment
Hide comment
@bakso

bakso May 19, 2015

How to get the cookie in client?

bakso commented May 19, 2015

How to get the cookie in client?

@joeferraro

This comment has been minimized.

Show comment
Hide comment
@joeferraro

joeferraro May 28, 2015

@iostalk I've created a basic cookie manager that allows you to get/set cookies from react native: https://github.com/joeferraro/react-native-cookies

joeferraro commented May 28, 2015

@iostalk I've created a basic cookie manager that allows you to get/set cookies from react native: https://github.com/joeferraro/react-native-cookies

@brentvatne

This comment has been minimized.

Show comment
Hide comment
@brentvatne

brentvatne May 31, 2015

Collaborator

Awesome @joeferraro

Collaborator

brentvatne commented May 31, 2015

Awesome @joeferraro

@dev-rkoshlyak

This comment has been minimized.

Show comment
Hide comment
@dev-rkoshlyak

dev-rkoshlyak commented Jun 17, 2015

thank you @joeferraro

@xavibonell

This comment has been minimized.

Show comment
Hide comment
@xavibonell

xavibonell Jun 26, 2015

@joeferraro I'm trying to use your cookie manager, everything is in place, I require it successfully, but when I try to call any method on the object CookieManager it throws this error: Error: Cannot read property 'getAll' of undefined

This is my code:
var React = require('react-native');
var CookieManager = require('react-native-cookies');
console.log(CookieManager);
CookieManager.getAll((err, res) => { console.log('cookies!'); console.log(err); console.log(res); });
Is weird cause CookieManager is defined, since it gets logged properly in the console, with all its methods.
Any idea where I went wrong?

xavibonell commented Jun 26, 2015

@joeferraro I'm trying to use your cookie manager, everything is in place, I require it successfully, but when I try to call any method on the object CookieManager it throws this error: Error: Cannot read property 'getAll' of undefined

This is my code:
var React = require('react-native');
var CookieManager = require('react-native-cookies');
console.log(CookieManager);
CookieManager.getAll((err, res) => { console.log('cookies!'); console.log(err); console.log(res); });
Is weird cause CookieManager is defined, since it gets logged properly in the console, with all its methods.
Any idea where I went wrong?

@nicklockwood

This comment has been minimized.

Show comment
Hide comment
@nicklockwood

nicklockwood Jun 26, 2015

Contributor

@xavibonell did you include the native RNCookieManagerIOS.h/m files in your Xcode project? It's not sufficient just to require the js.

Contributor

nicklockwood commented Jun 26, 2015

@xavibonell did you include the native RNCookieManagerIOS.h/m files in your Xcode project? It's not sufficient just to require the js.

@nicklockwood

This comment has been minimized.

Show comment
Hide comment
@nicklockwood

nicklockwood Jun 26, 2015

Contributor

@joeferraro this is likely to be a common source of confusion. It might be a good idea to include an invariant inside your index.js to the effect of:

var invariant = require('invariant');
invariant(
   NativeModules.RNCookieManagerIOS,
   'Add RNCookieManagerIOS.h and RNCookieManagerIOS.m to your Xcode project.'
);
Contributor

nicklockwood commented Jun 26, 2015

@joeferraro this is likely to be a common source of confusion. It might be a good idea to include an invariant inside your index.js to the effect of:

var invariant = require('invariant');
invariant(
   NativeModules.RNCookieManagerIOS,
   'Add RNCookieManagerIOS.h and RNCookieManagerIOS.m to your Xcode project.'
);
@eyaleizenberg

This comment has been minimized.

Show comment
Hide comment
@eyaleizenberg

eyaleizenberg Jul 9, 2015

Contributor

@joeferraro I am faced with the same issue as @xavibonell
Any clue anyone?

Contributor

eyaleizenberg commented Jul 9, 2015

@joeferraro I am faced with the same issue as @xavibonell
Any clue anyone?

@ryanmcdermott

This comment has been minimized.

Show comment
Hide comment
@ryanmcdermott

ryanmcdermott Sep 3, 2015

For anyone curious about React Native cookie handling I made an example project that shows how to use cookie authentication. It makes use of the library from @joeferraro https://github.com/ryanmcdermott/react-native-login

ryanmcdermott commented Sep 3, 2015

For anyone curious about React Native cookie handling I made an example project that shows how to use cookie authentication. It makes use of the library from @joeferraro https://github.com/ryanmcdermott/react-native-login

@brentvatne

This comment has been minimized.

Show comment
Hide comment
@brentvatne

brentvatne Sep 3, 2015

Collaborator

Thanks for sharing, @ryanmcdermott! Added it to the newsletter for this week

Collaborator

brentvatne commented Sep 3, 2015

Thanks for sharing, @ryanmcdermott! Added it to the newsletter for this week

@ryanmcdermott

This comment has been minimized.

Show comment
Hide comment
@ryanmcdermott

ryanmcdermott Sep 3, 2015

@brentvatne Thank you I appreciate it!

ryanmcdermott commented Sep 3, 2015

@brentvatne Thank you I appreciate it!

@vince-rowe

This comment has been minimized.

Show comment
Hide comment
@vince-rowe

vince-rowe Jun 10, 2016

hi there,

I just wanted to check if my best case is to use https://github.com/joeferraro/react-native-cookies or if there is another way to simply clear / override the Cookie header in Fetch.

I'm using Fetch like this:

fetch(ENDPOINT, {
method: 'GET',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'Cookie': user.session_name + '=' + user.sessid,
}
})

Which only works after the first visit, the first one seems to send double Cookie's because fetch has grabbed one from an initial login request and saved it. When it does the request it sends two sets of cookies which confuses the endpoint server and doesn't accept the connection. But after that because the automatic cookie is no longer there it then works. So basically I think if I can just either clear the automatic cookie before I run this call, or make sure in my call where I set cookie above that it is the ONLY one being set.

Do you think installing https://github.com/joeferraro/react-native-cookies and running clear cookies before this call will be my best bet?

Hope this makes sense.

Vince

vince-rowe commented Jun 10, 2016

hi there,

I just wanted to check if my best case is to use https://github.com/joeferraro/react-native-cookies or if there is another way to simply clear / override the Cookie header in Fetch.

I'm using Fetch like this:

fetch(ENDPOINT, {
method: 'GET',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'Cookie': user.session_name + '=' + user.sessid,
}
})

Which only works after the first visit, the first one seems to send double Cookie's because fetch has grabbed one from an initial login request and saved it. When it does the request it sends two sets of cookies which confuses the endpoint server and doesn't accept the connection. But after that because the automatic cookie is no longer there it then works. So basically I think if I can just either clear the automatic cookie before I run this call, or make sure in my call where I set cookie above that it is the ONLY one being set.

Do you think installing https://github.com/joeferraro/react-native-cookies and running clear cookies before this call will be my best bet?

Hope this makes sense.

Vince

@kristojorg

This comment has been minimized.

Show comment
Hide comment
@kristojorg

kristojorg Jul 5, 2016

I am wondering the same thing as @vince-rowe. I don't use cookies, but fetch is using them in the background and I would just like to delete or override them in fetch without installing a third party library.

kristojorg commented Jul 5, 2016

I am wondering the same thing as @vince-rowe. I don't use cookies, but fetch is using them in the background and I would just like to delete or override them in fetch without installing a third party library.

@ms88privat

This comment has been minimized.

Show comment
Hide comment
@ms88privat

ms88privat Jul 6, 2016

I also want to find an easy solution to disable cookies at all.

ms88privat commented Jul 6, 2016

I also want to find an easy solution to disable cookies at all.

@hawkrives hawkrives referenced this issue Aug 30, 2016

Merged

Oauth stuff #184

@hbd

This comment has been minimized.

Show comment
Hide comment
@hbd

hbd Sep 6, 2016

@ms88privat @kristojorg by default, fetch() does not send cookies.

If you're still having issues, you may want to try

fetch( ... {
...
credentials: 'omit'
})

hbd commented Sep 6, 2016

@ms88privat @kristojorg by default, fetch() does not send cookies.

If you're still having issues, you may want to try

fetch( ... {
...
credentials: 'omit'
})
@ms88privat

This comment has been minimized.

Show comment
Hide comment
@ms88privat

ms88privat Sep 6, 2016

@hbd I don't need it anymore, but I beleave, it wasn't the case. I also tried the credential property and so on. Like they said, it is managed by objective-c and not the fetch API

ms88privat commented Sep 6, 2016

@hbd I don't need it anymore, but I beleave, it wasn't the case. I also tried the credential property and so on. Like they said, it is managed by objective-c and not the fetch API

@chengmu

This comment has been minimized.

Show comment
Hide comment
@chengmu

chengmu Sep 14, 2016

two sets of cookie troubles me... wish a solution.

chengmu commented Sep 14, 2016

two sets of cookie troubles me... wish a solution.

@haiyangjiajian

This comment has been minimized.

Show comment
Hide comment
@haiyangjiajian

haiyangjiajian Oct 20, 2016

@ms88privat Have you found the solution to disable cookies. I have the same problem."credentials: 'omit'" dosen't work

haiyangjiajian commented Oct 20, 2016

@ms88privat Have you found the solution to disable cookies. I have the same problem."credentials: 'omit'" dosen't work

@davidck

This comment has been minimized.

Show comment
Hide comment
@davidck

davidck Oct 27, 2016

Same issue. An external API in which I have no control is throwing 403s when a cookie is detected. Seems like there is a double-cookie issue as overriding the API's PHPSESSID did not help. The same override worked when using Postman.

davidck commented Oct 27, 2016

Same issue. An external API in which I have no control is throwing 403s when a cookie is detected. Seems like there is a double-cookie issue as overriding the API's PHPSESSID did not help. The same override worked when using Postman.

@Ashoat

This comment has been minimized.

Show comment
Hide comment
@Ashoat

Ashoat Mar 15, 2017

Collaborator

I am also trying to handle cookies entirely within Javascript and seeing the same Android issue where the cookies are set regardless of credentials: 'omit' being passed to fetch. I opened #12956 to track the issue; heads-up @davidck, @haiyangjiajian, @ms88privat, @kristojorg, @vince-rowe. At this time, looks like the problem is only occurring on Android.

Collaborator

Ashoat commented Mar 15, 2017

I am also trying to handle cookies entirely within Javascript and seeing the same Android issue where the cookies are set regardless of credentials: 'omit' being passed to fetch. I opened #12956 to track the issue; heads-up @davidck, @haiyangjiajian, @ms88privat, @kristojorg, @vince-rowe. At this time, looks like the problem is only occurring on Android.

@asinel

This comment has been minimized.

Show comment
Hide comment
@asinel

asinel Oct 12, 2017

Also have this problem, credentials: 'omit' doesn't work

asinel commented Oct 12, 2017

Also have this problem, credentials: 'omit' doesn't work

@jaredramirez

This comment has been minimized.

Show comment
Hide comment
@jaredramirez

jaredramirez Nov 22, 2017

@vince-rowe Here's how I removed cookies from my requests:

After authenticating my user, I took the cookie off of the response header. Then I save the cookie to AsyncStorage. Next, I use react-native-cookies (https://www.npmjs.com/package/react-native-cookies) to clear all of the cookies saved on the native side. Then, on any request that needs the cookie, I take it from AsyncStorage and add it to the header to my request using axios (https://www.npmjs.com/package/axios).

import CookieManager from 'react-native-cookies';
import axios from 'axios';

...

// make call to server to authenticate
const response = await axios({
    method: 'post;,
    data: {username: ..., password: ...},
})

// Pull cookie off response
const cookieToSave = response.headers['set-cookie'][0];

// Save cookieToSave to AsyncStorag

// Clear cookies automatically saved on native side
await CookieManager.clearAll();

// Pull cookie from AsyncStorage
const authenticationCookie = ...;

// Then later, make a request and add the header
const authenticatedResponse = await axios({
    ...,
    headers: {Cookie: authenticationCookie},
});

jaredramirez commented Nov 22, 2017

@vince-rowe Here's how I removed cookies from my requests:

After authenticating my user, I took the cookie off of the response header. Then I save the cookie to AsyncStorage. Next, I use react-native-cookies (https://www.npmjs.com/package/react-native-cookies) to clear all of the cookies saved on the native side. Then, on any request that needs the cookie, I take it from AsyncStorage and add it to the header to my request using axios (https://www.npmjs.com/package/axios).

import CookieManager from 'react-native-cookies';
import axios from 'axios';

...

// make call to server to authenticate
const response = await axios({
    method: 'post;,
    data: {username: ..., password: ...},
})

// Pull cookie off response
const cookieToSave = response.headers['set-cookie'][0];

// Save cookieToSave to AsyncStorag

// Clear cookies automatically saved on native side
await CookieManager.clearAll();

// Pull cookie from AsyncStorage
const authenticationCookie = ...;

// Then later, make a request and add the header
const authenticatedResponse = await axios({
    ...,
    headers: {Cookie: authenticationCookie},
});

@facebook facebook locked as resolved and limited conversation to collaborators May 29, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.