React Native fetch() losing cookie - http

I am using React Native fetch() in order to authenticate against a REST API which uses session cookies.
The session cookie received upon sign-in is automatically sent back with every request, and this works fine.
However, if I sign in and then quit the app, upon starting the app again the session cookie seems to have been lost.
How can I persist the sign-in cookie so it's stil there after an app unload?

There are several cookie-based react-native components out there. One of these might be helpful to you.
https://github.com/joeferraro/react-native-cookies
https://github.com/shimohq/react-native-cookie
https://github.com/beefe/react-native-cookiemanager
I've heard of some solutions which use the webview to persist cookie-based authentication as well. But if you can, I suggest looking into a stateless method of auth persistence, something like JWT for instance. You can then cache the key in local storage.
In the end, it might be easiest if you just cache the cookie's session variable into local storage yourself, then manually inject the cookie header into your fetch() requests yourself on every request.

Did you try?
fetch(url, {
credentials: 'include'
})
Source

Related

Use refresh token cookie in nextauth

I used to have a custom implementation of authentication on my website. I use NestJs as backend, when I login, the backend response with access token, set the refresh token as http only cookie restricted on the refresh path and once the access Token has expires it will refresh the access token. Now that I use NextAuth, Nest can't set the cookie anymore. I was wondering what is the best practice for the refresh token ? Should I transfer the cookie to the front ?
Doesn't bother me to change the logic and backend, just want the most secure and best practice.
Now that I use NextAuth, Nest can't set the cookie anymore
Nest will send the cookie to the browser. and since you are using next you will at some point send Requests from inside getStaticProps or getServerSidePros but those functions are running on the server so they do not have any relation with the browser therefore they will not send back the cookie.
what I sugesst is to also send your refreshToken in the response and store both in next-auth session so you can access them from wherever you want inside your next app using useSession()
Doesn't bother me to change the logic
not a lot
just want the most secure and best practice
storing JWT tokens securely in the browser is impossible. see here

NextJS getServerSideProps with custom Authentication service (REST API)

I am trying to get my own authentication service working with my nextJS app. My own authentication service is a simple rest api that returns a JWT access token and a JWT refresh token on entering correct credentials.
Currently I am setting the JWT refresh token as a httpOnly cookie and the JWT access token into a state variable (in memory) in my nextjs app.
I am stuck at these points:
How do I pre-render sites in nextjs (getServerSideProps) with some custom user data that I want to fetch based on the JWT access token?
How can I pass this access token to getServerSideProps?
I wanted to pass the access token that is stored in memory to getServerSideProps but unfortunately I could not get it to work. Or at least I don't know how.
Do I have to put the JWT access token as a httpOnly cookie as well? Then I can retrieve the access token cookie in getServerSideProps.
But then this approach is vulnerable to CSRF as pointed out in this question:
Where to store the refresh token on the Client?
Is there a possibility to make a solution with two httpOnly cookies (one for refresh and one for access token) secure?
Is it secure to set both cookies as httpOnly and samesite strict? and set the path of the refresh token cookie to /refresh-token only? So the refresh token cookie is only sent to /refresh-token and not everywhere else.
I have seen that there is the next-auth module there I can use the getSession function on serverside but since I have my own authentication service that handles all the token management I am not sure if it is a good idea or even possible to wire my own authentication system with next-auth.
Depending on how your own authentication system works, if it adhere's to the oauth / openid-connect standards, you can simply use a custom oauth provider in next-auth.
Otherwise you could use their Credentials Provider which allows for even more customization.

How to setup a refresh_Token call with Hasura and firebase

I have a Hasura server running and firebase-functions. On the frontend I have angular.
I have a working login function that gets the jwt token and the refreshtoken. However I would like to save them in a serverside HttpOnly cookie and make a silent refresh from the client.
This explains the theory of it: https://hasura.io/blog/best-practices-of-using-jwt-with-graphql/
but not the practice.
How do I create such a token in my login function in firebase? And what do I have to set up in Hasura?
It seems the article you mention, explains that the refresh token process is done by having a separate server (outside of Hasura) that handles creating and refreshing the refresh token. On the frontend you constantly hit that server to keep refreshing the jwt and refresh token. This can be done by having a setInterval/setTimeout or (better) using an axios/fetch interceptor on your requests. The idea is to have the jwt and refresh token valid by the time you make the request to Hasura.

Strategy for Rest API Authentication and How to Store Tokens on Client Applications

I'm setting up a Rest API for both native (mobile apps) and browser-based applications (react etc.). I'm using express.js and passport.js with LocalStrategy and JwtStrategy.
I've researched about this topic and there are a lot of different conversations or tutorials. Most of the tutorials just creates an access token and never talks about how to refresh it. And a lot of others just uses providers like Okta or Auth0. I don't want to reinvent the wheel but I think I should be able to create a simple authentication mechanism.
My current process is like this;
* Create an access and refresh token on login. Return them as response.
* Client stores it. In react I use localStorage to store the tokens.
* Add Authorization: Bearer <access_token> header to requests.
* When the access_token expires, get new tokens by using the current refresh_token.
I'm storing refresh tokens to DB on the server. So, a users can track all of their current sessions or an admin can invoke them when there is a security issue.
After a lot of research I see that there is a big disagreement on either using localStorage to store tokens on the browser, or return tokens as httpOnly cookies.
And when I examined some popular websites I saw that, websites like Facebook, Github, Youtube, 9gag use cookies to keep you signed in. They don't send an Authorization: Bearer <access_token> header. There are mainly information about UI states in the localStorage. But when you delete the SID cookie, all of them logs you out. Are they using session-based authentication?
When you login to TMDb (the movie database), it sets 2 cookies named as access_token (which is just a JWT) and session. I guess this is an implementation which the server returns the access token and some sort of a "persistance" information (session) as cookies.
Firebase (one of my favorites about this topic) just stores both the access and refresh token to localStorage. It actually uses indexedDB but I've read it falls back to localStorage when it can't use indexedDB.
But OWASP recommends that "browser-based applications should never retrieve a refresh token". I guess this means when the access token is expired, authorization server should be checked to see if there is still a session going on and then a new access token is retrieved. (Silent renew)
The only exception that I've seen is Azure Portal. It sends bearer tokens in the Authorization header. It stores the refresh token in the localStorage. And a lot of "security sensitive" corporations use it to deploy/maintain their applications or databases etc.
So, Firebase and Azure Portal are examples to access/refresh tokens saved to localStorage on the browser. TMDb is an example to getting tokens in httpOnly cookies. And Facebook, Youtube etc. are using some sort of authentication mechanism that I couldn't understand. Cookies and sessions I think?
Returning access and refresh tokens to both native and browser-based applications has a really simple logic and implementation. Storing them in localStorage always felt like it is a big risk. But I didn't want to set cookies for web applications and return JSON response for mobile applications. I felt like they should be the same. And after seeing examples like Firebase and Azure Portal, I don't feel like it is that much wrong.
But is it really safe even if there are a lot of disagreement and articles about this? And even if Firebase and Azure Portal are good examples to this strategy, why are websites like Facebook, 9gag, Youtube mainly use cookies (and sessions I think) for authentication?
I know this is a big topic. I know there may be a lot of different approaches. But I think I need some sort of a cornerstone idea to implement authentication for simple applications.

iOS AFNetworking - ASP.NET Web API .ASPXAUTH storage and deletion

I'm using the AFNetworking Framework for iOS. I've subclassed AFHttpClient and are using it as a singleton, i.e. [TestAFClient sharedClient]
I'm consuming an ASP.NET Web Service API that requires the use of the .ASPXAUTH cookie. First I have to authenticate, receive the .ASPXAUTH cookie in response, and then must pass this cookie with each subsequent request.
After a few tests, it appears that, because I'm using a singleton AFHTTPClient, the .ASPXAuth cookie persists and, thus, no explicit storage of the cookie is required.
However, as part of my App, I need to "logout" at some point.
What is the most efficient way to clear this cookie, in order to logout? Set the singleton to nil and re-initialize it? Do something like setValue:forKey:?
Additionally, is it better that I explicitly store the .ASPXAUTH cookie? And does this expire or automatically renew if necessary?
Thanks,
Robby
Cookies are actually handled by the underlying URL-loading system, similar to the way cacheing is handled automatically by NSURLCache. For [NSHTTPCookieStorage sharedHTTPCookieStorage], you'll want to find the cookie at your baseURL, and then delete it. You can explicitly set or modify an existing cookie in the same way.

Resources