NextJS - Authentication via external API - authentication

Visual Explanation
So basically I have an Express REST API that handles login and everything, I need to create a new service in NextJS that will handle some features, BUT, I wish to use the capability of NextJS of making a request to its own API and only then send the request further to my Express API, further adding an extra layer of security.
My current setup is that I am making an axios POST request from my proxy api to my express api, I receive all my account details and everything, I received my session cookie, but how do I manage to set it? So far I tried sending it to the front separately and set it there, but that does not seem to work.
To be mentioned:
I do have "withCredentials: true" for axios in order to persist the session and make further requests using the cookies token.

Related

Using the JWT from Next-Auth to secure my server as well

I am setting up a next.js app and was planning on using next-auth's JWT strategy for auth. I understand how the workflow works to protect your next.js routes and api endpoints within your API folder, but I have a separate express.js server that handles an API to my database that this app will be using.
My question is, is there some way to send the JWT token to my express server along with any api calls, and hold the secret on that server as well to authenticate the session and give the user access to the api routes?
My thought was to do this either in a next-auth callback or just send the jwt token along when needed. I was just having trouble finding a way to view the full jwt server side. All of the server-side hooks next-auth provide parse out the data from the JWT.
Thanks for any insight.
Yes you can achieve this using the CredentialsProvider what you have to do is call your login endpoint to recive your JWT tokens once the user logged in and store them in next-auth session then you can access it using useSession() from anywhere to get the token you need and send it along with any REQUEST you want to send to your backend server.

Make authenticated API requests from Apollo studio explorer to Apollo express server that is protected by a third party auth service (keycloak)

I am using keycloak to authenticate my Apollo server express API. Including the bearer token in the Apollo studio header is not enough to authenticate the studio as the request needs to contain certain cookies provided by keycloak that are set in the browser when I log into the front end app.
The front end sends this cookie along with the bearer token to the server. While I have the option to manually define an authentication token in Apollo studio, I don’t know of a way to attach the cookie to the request.
Interestingly enough, when I use postman to query my API, postman will actually extract the cookie in the browser that has already been set by logging into the front end and include it in any postman requests to the URL that corresponds to the cookie, so I can make authenticated requests with postman if I have already logged into my front end. Unfortunately Apollo studio does not do this.
How can I provide Authentication with the cookie from my Apollo studio? It’s a bit tricky since Apollo studio is not hosted by my backend application. Can I have express middleware to insert the cookie in requests coming from Apollo studio? What would this look like?
I’ve also heard talk about creating a proxy but I don’t really understand this option, is this a viable solution and how would it work?

Remove httponly from cookie when making HTTP call using Flutter

I have an Express application that has a cookie-based authenticated route. I am using cookie-session to store auth tokens in the cookie.
I am developing a mobile app using Flutter and am using the requests package to manage cookies while making HTTP calls. I am able to make basic HTTP GET and POST calls.
My Express application has two routes - Sign In and Get Info. The route to Sign In authenticates the user and sets an auth token in the cookie using cookie-session. The Get Info gets information for an authenticated user, and the authentication is checked by a middleware.
The Express application is working as expected when I make calls using Postman or curl but is failing when I make calls using Flutter.
When I analysed the differences, I found that the Flutter application is adding an 'httponly' in the cookie, and consequently, the auth tokens are not being extracted. When making the same call using curl, it failed with httponly and worked when I removed the httponly flag in the cookie.
I tried toggling httponly in cookie-session by using sessionOptions and it has not worked.
Can someone help me out on this? I would be happy to provide additional information if it is required.

How to access KeyCloak endpoints via proxy API

I currently have the following architecture
APP -> API -> KeyCloak
I want the APP to be able to send requests to my API which will then internally proxy certain requests to KeyCloak. For example, I'd like to make a request to the /userinfo endpoint in KeyCloak through my API. If I can figure this out I can then perform more complex features.
APP -> http://api:port/api/userinfo
API -> http://keycloak:port/auth/realms/quartech/protocol/openid-connect/userinfo
I have a valid JWT Bearer token. As I can directly make the request to KeyCloak successfully, however if I attempt to make the request via my API it returns 401. Even though it is using the same JWT Bearer token.
I believe it has something to do with configuring the KeyCloak client to allow requests to come from the API. But so far I haven't been able to figure it out.
I've discovered it required a DNS entry to local development within a Docker container.
I've edited the hosts file and added a 127.0.0.1 keycloak and then al

Token authentication in SPA app

I started new project. It is small application (playground) to learn couple new concepts. I will create backend API using Ruby on Rails and Single Page Application using React. I stuck in Authentication. I would like to create custom Token-based Authorization/Authorization. I came to following auth flow:
User fill password/login and send to backed using Ajax and through secured HTTPS connection.
Backed checks if user exist in DB. If user exist backend create Token and save to Redis with user id.
Backend response with token to client app.
On client side I will save above token to local storage.
Before every request I will get token from locale storage and pass to request header.
On backend I will take token from header and check if exist in Redis db.
Is this flow correct? Should I decrypt token on client side or It is not necessary? This project is only playground but I would like to do It properly. Please give me some comments if above flow isn't good enough.
I think that you have the right approach. This link could give you more details about token-based authentication:
Implementing authentication with tokens for RESTful applications - https://templth.wordpress.com/2015/01/05/implementing-authentication-with-tokens-for-restful-applications/
Hope it helps you,
Thierry