Firebase App with Cloud functions Cookie not being set on firebase hosting - reactjs

Have a firebase app (server side React) that receives a http only cookie from a firebase functions Rest API as part of the response. This works fine on localhost but when i publish to firebase hosting no cookie is received. I'm thinking its either because the FB hosting is https or it is CORS related that the cookie is not being set.
Insight and how to fix would be helpful.
Cheers

Related

request hitting from frontend is not reaching backend deployed in EC2

Im trying to hit an api to custom subdomain(api.example.com) for analytics to the backend.
It is working fine in localhost but in hosted environment the api is giving cors error.
I guess its the issue with hostedzone configuration.
As of now backend is not at all connected to the frontend.
need help.
this is the domain where my backend is hosted(http://54.95.135.232:8080)
ive tried mapping this url to the subdomain in godaddy so that once i hit the subdomain(api.example.com) it will redirect to the backend hosted port.
but its not at all working.

How to get cookie in cloud functions from my firebase web app

I have a web app hosting in firebase and i have a single sign on login where i set requestId cookie in firebase cloud functions domain.
Now after login in single sign on i need to need that requestId cookie in my firebase web app.
I tried getting the cookies using document.cookie
also i tried using react-ccokie I am getting only the cookies stored in web app.
Is there any API for getting cookies from firebase cloud functions
Note: The third party login app is Ping Identity
I am using react 16.13.1 and firebase verion 7.16.1

Passport Authentication works through Postman but not Web App

Using Express and Passport JS on the backend we are currently able to login to the application, and access all of the API requests using postman.
However when we try and make API requests that require authentication on the React JS Web Application we get a 401 unauthorised error.
We've run logs from both the postman request and the web app request and both are passing the connect.sid cookie in the header.
My question is, how do I get the application authenticated and able to make API requests like postman can. I login to postman the same way I do using the web application but it doesn't authenticate the api requests.
Things I've tried:
manually setting the headers to allow cross origin requests
setting an Authorize bearer token
Specifying on the backend the origin of the front end, which only allows api calls to be made from the front end web server
The application is a ReactJS application, and I am making the API calls using Axios
I fixed this by passing withCredentials on login, this sends your user to the passport.js and authenticates the user.
You need to call withCredentials every time you make an API call though

Cookie from API on different domain that I control

I'm implementing login functionality on my site and I'm running into some problems when sending jwt tokens as cookies.
When the user logs in on the frontend, a POST request is sent with "credentials: 'include'" (I'm using fetch) to my backend API, which returns a jwt token if the login was successful. This all works fine, and I can see the cookie in chrome dev tools, and performing actions that require authentication work fine.
However, when I refresh the site, the jwt cookies disappear. I have ruled out errors with expiration. Through experimentation I've figured out that the domain is the problem. The cookie's domain is "127.0.0.1" from the locally hosted instance of the API, which is different than the domain of the locally hosted website. If I manually change the domain of the cookie to the same as the website, the cookie doesn't disappear.
But that does not solve my problem permanently, as the backend API is hosted on a different domain than the frontend. I've been reading up on cross-domain requests but I'm not sure how to proceed from here. I control both the frontend and the backend, but I'm starting to wonder if I might be going about this the wrong way? Would the simplest solution be to host my api on, say 'api.mydomain.com' instead?

How to persist authenticated state in a sailsJS backend app when requests are from another domain?

I have an architecture where I'm using sailsJS (custom node.js implementation) as my api server and an angular front end server. Each app is being served from different domains.
How can I maintain an authenticated session in the sailsJS api app between requests?
Sails has an integrated req.session object for maintaining sessions but it doesn't seem to be working out of the box when the client is being served from another domain.
You need to check two things when doing cross-origin requests from your front-end app to your Sails app:
Make sure your Sails app has CORS enabled; this will ensure that the browser doesn't block the requests for security reasons
Make sure the withCredentials flag is set in your AJAX request; this will ensure that your cookie is sent to Sails and your session is maintained.
With Restangular, you can set withCredentials to be used on all requests by default using setDefaultHttpFields; see this answer for details.

Resources