How i red here, if i need to send cookie from nodejs to react application both app should be on the same port. Doing this on the server: res.cookie('token', token, { httpOnly: true }); i can send the cookies on front-end if i have the same ports, but here appear the issue if the both apps are on the same port, because if i access on front end for example http://localhost:4001/login and my server also is on http://localhost:4001, i can get the 404 error, because in this way i access the server route http://localhost:4001/login not front-end. Question: So How to solve this issue when the routes mess with each other and to be able to send the cookies?
One of the solutions is to use domains instead of ports.
For this purpose you can launch an edge web server locally (for instance Nginx or Apache) with port forwarding and set mapping from your domain to your localhost.
Also, you can use one of the plenty of services that can expose your local web servers to the Internet. Probably it could be the easiest one for you. Here is the sequence of actions then you can apply to resolve the issue:
Step 1
Run frontend and backend apps on two different ports, let's say 4001 for the backend app and 4002 for the frontend app. As a result of the step, you have to be sure that both apps are up and running and accessible via ports.
Step 2
Sign up and install https://ngrok.com/ or any other service which can expose your local app to the internet with a domain.
If you will choose ngrok, my suggestion is to write a configuration file and place it in the default location. (default location of config-file depends on your OS - here is the link to the documentation: https://ngrok.com/docs#config-default-location)
Here is the example of a config file:
authtoken: // place your ngrok access token here
region: eu
tunnels:
frontend_app:
proto: http
addr: 4002
backend_app:
proto: http
addr: 4001
Don't forget to place your authtoken, to get one you have to signup.
For more information about setup ngrok, please check the official documentation: https://ngrok.com/docs#getting-started-expose
https://ngrok.com/docs#tunnel-definitions
As a result after you launch ngrok you have to get the next output in the console:
Forwarding http://569de0ddbe4c.ngrok.io -> localhost:4002
Forwarding https://93b5cdf7c53f.ngrok.io -> localhost:4001
And be able to access your local apps via generated external addresses.
Step3
The last two things you have to do are:
Replace your API endpoint with an external URL (https://93b5cdf7c53f.ngrok.io in my example) in your frontend app.
Tweak res.cookie call in the backend app to make possible access cookies from both domains: res.cookie('token', token, { httpOnly: true , domain: 'ngrok.io' })
That's it. Now your apps are accessible from the Internet by different third-level domains with shared cookie between them.
Related
I have setup and application which uses a React front-end and Expres/NodeJS back-end. There is an ALB in the mix as well.
So, here is how the flow goes:
The ALB listens on port 443 and there is an Authentication action attached to the listener. This action uses and Amazon Cognito user pool, scope is openid. Once the authentication is successful the ALB redirects the request to the React app which in it's turn sends http requests back to the ALB which redirects them to the Express app on the server-side. I have setup the communication between FE and BE like this because we use Amazon ECS and I don't have a static DNS or IP except for the ALB.
I am unable to get the x-amzn-oidc-data header when console logging the req.headers. This header is important to me because I'd like to verify and work with the JWT that it contains.
I have read most of the docs on the Internet and they say that the ALB automatically sends this header (and couple of others) to the back-end. However, I only see one x-amzn-trace-id which has nothing to do with the JWT issued by Cognito.
Where do you think is my error? My setup seems pretty standard to me - how could I get that header?
Thanks in advance!
I've set up a tunnel using ngrok. I did so mainly to be able to get callbacks from services our server integrates with via Webhooks, while running on local machine during development and testing.
I reserved a domain, example:
123.ngrok.io
When I run my server locally, the tunnel is setup and I can hit it via browser going to 123.ngrok.io, but, when I do so, the browser asks me to authenticate:
My question is this:
Will the service calling the Webhooks to 123.ngrok.io be required to authenticate? If so, I have no idea how to make that work.
Ultimately I need the Webhooks to run like they do when hitting live, no auth needed.
Is ngrok going to block the Webhooks calls from various services due to authentication?
UPDATE:
I have tested the Webhooks hitting my reserved ngrok domain, example, 123.ngrok.io. The service that hits that Webhook at that domain is triggered but returns 401 Unauthorized.
It seems like ngrok is not letting the Webhook through. How do I fix this?
So I eventually got rid of the 401 error when services were trying to hit the reserved domain by commenting out the auth line in the connect call on ngrok:
const result = await ngrok.connect({
proto: 'http',
addr: PORT,
// auth: `${process.env.NGROK_USER}:${process.env.NGROK_PSW}`,
subdomain: '123' // reserved tunnel name 123.ngrok.io
})
This fixed my problem.
I want to use Keycloak to secure my node.js application (There are two parts of my app one on port 3003 and the other on 3000). My application is running on port 3003. But I want to secure a page which is running on 3000. How can I do this?
To protect an open interface/port in your application, you need a gateway (reverse proxy). Keycloak is not a gateway but an Authorization server. Of course, Keycloak can do the authentication and authorization for the users accessing port 3000 (e. g. issue a token), but not the access policy enforcement (validate the token and grant/deny access).
There are several gateway/reverse proxies on the market. However, it depends on the service running on port 3000 which fits best. E. g. for an HTTP based API you could use Kong (which is available as an Open Source community edition).
Well, you don't have to connect Keycloak to both of them. Try doing it for one of them and communicate in a different way.
I currently have a node js server deployed to heroku. I want to restrict non-authorized domains from interacting with the API's. I know I can do this on the server side by either requiring authentication or by requiring specific request host. But is there a way to configure that on heroku? To only allow a specific server owned by me to call the node serer.
Heroku most likey adds an x-forwarded-for header to requests it is sending to your application. You'll want to get the first address in that list:
const ip = (req.headers['x-forwarded-for'] || '').split(',')[0];
Where req is a request object. This glitch demonstrates it in action.
Using this address, you can respond to traffic depending on its IP from your node server.
I want to build a node js internet gateway/captive portal. So I can have a user 'authorize' his mac address or ip address if the mac address is not possible like used for wifi hotspots
So what I have in mind is node can have a dhcp server and it gives its ip address as the gateway. So if the user loads a page on the web browser it gives them an authentication screen and they can then log in and the gateway can then route its packets correctly.
How can I do the authorization step with node.js so if they're not logged in it presents a log in page & if they are to route the packets correctly?
You need couple of pieces to put this together.
#1: http proxy - If you can run a DHCP server and assign IP addresses, then you can run and http-proxy to capture all internet traffic.
#2: You'll then need to add authentication logic to this proxy which can check for a cookie, magic packet, token or something that verifies access and lets them through or redirects to login page.
node-http-proxy is a very popular and flexible node http proxy server that you can easily add your own logic to.
node-http-auth-proxy is another such project with an example of how to handle authentication built in.
Having a proxy also allows you to whitelist/blacklist sites/IPs, something you may wanna do based on your target audience.