React-router and Express server on same port - javascript

I am developing a website that uses react and react-router for the frontend and express for the server. I'm trying to implement session based authentication by using express-session, however, the only way that I've been able to get the cookie to save in the browser was by having the express server run on the same port that react-router is (localhost:3000).
I'm not sure how to phrase this question, but is this "OK"? There doesn't appear to be any obvious problems caused by doing this but I'm not sure if having them both run on the same port is "good" or "bad".
Could there be any problems caused by having react-router and express running on the same port? If so, how can I get express to save the cookie on a port that's different from the express server itself?

I figured it out. YES this is bad, the solution is to set up a proxy for create react app
https://create-react-app.dev/docs/proxying-api-requests-in-development/

Related

Not allowed to request resource (fetch error)

I'm trying to hosting my Express server on my personal computer because it needs Linux + Wine (for building commands). And for using him, I've opened my ports, and I can access to my Express page normally, but if I try to fetch the URL from the Express app, it won't work.
Here's the errors : https://imgur.com/4hdznw7
Here's the code of my Express app : https://hastebin.com/mihizegatu.typescript
Warning I've tried to publish my Express app on Heroku, and I can fetch it. But if I fetch my Express app from my personal computer, it won't works (errors upper).
Do you have an idea of why it doesn't work ?
Thanks in advance,
Corentin de Maupeou

Moving ExpressJS API files onto Server

So I created an simple API using ExpressJS that connects to MongoDB to perform CRUD operations. Currently I am able to get the local host running by performing command "npm nodemon" in the source folder. And it worked by testing with postman I wonder how to implement it on the server. As server runs a linux system, also I have a line of code in my root file "server.js ":
const port = process.env.PORT || 5000;
I think the process.env.port needs need to be changed in order to make it work on the server?
In addition, I did look into aws CE2 server it is so complicated that I was immediately overwhelmed. I am hoping someone can recommend dummy like me a simple and very specific solution to have a server run my scripts in ExpressJS environment. Thank you
I'm assuming your question is "How to deploy express app to a server?"
You can read some advanced topics on http://expressjs.com/, which covers some best practices, and other useful stuff. But the things you want to look at now is Things to do in your environment / setup
The important part is:
Keep your express runing on port 5000
Run your app in cluster
Run your app behind a proxy server like Nginx.
You can check this nice guide (Step 3 and 4) on how to deploy your express app to a Linux server with PM2, Nginx.
So at the end, your express app will run on port 5000 (or whatever port you desire), and your Nginx will run on port 80, and nginx will forward any request to your express app.

How to connect frontend and backend on domain

I don't really have experience with backend and how things work together. I have created a simple live message sending app with node.js and socket.io. When I host a static web server on my machine (http-server which runs on local port using node.js) my app works perfectly fine but when I upload it on my host or github pages just for test, the backend doesn't seem to work. I uploaded all my files with an FTP program and the frontend loads fine but the backend doesn't. Do I have to know something like Django or ASP.NET to make these work on my host?
EDIT: One more thing, first line in my server.js is const io = require('socket.io')(3000)and in my script.js - const socket = io('http://localhost:3000')where 3000 and localhost:3000 stands for local host in my machine. What do i need to put instead of these?
You probably need to install and setup Node.js on your server, contact yout hosting provider for node installation if the option isn't available in yout cPanel.

React-Router Client-Side

Hi I'm new to React and having a bit of trouble with client-side routing.
I've seen in places that you can use react-router without a server instance like express or simple-server serving up the static files, but when I try to put something together I get this error:
[react-router] Location "/Users/<user>/Desktop/webapp-client/dist/index.html" did not match any routes
I would like to host the site as a static site e.g. Amazon S3 and cloudfront and connect to an NodeJS Express backend. I've seen that Angular 2 can route without having a server instance.
Could someone please shed some light?
You are completely right. If you will read this tutorial about react-router, you can realize that all files are static.
So problem is not in react-router, it is somewhere else (Amazon S3, NodeJS Express backend, etc.)

Setting laravel to work on a port number?

I am working with nodejs, expressjs, and socket.io I am triggering events on my web app with a mobile phone over the nodejs server.
The app is built on javascript but I am using laravel to store data into a database. I am new to nodejs so I am pretty sure if I wanted, I think I could cut out php and just use the whole app with nodejs, but I don't want to. I like laravel and php and it's alread setup, so let me explain my problem.
laravel is installed on my server http://example.com/public/ laravel's index.php is here. My routes for my data base resources are http://example.com/public/feeds. I can access this fine, but if I want to access my nodejs server I need to use http://example.com:3000 which obviously causes a problem.
The nodejs/expressjs files are inside http://example.com/public/MY-FILES-HERE but since the nodejs dispatches on http://example.com:3000 this throws my laravel routes off.
So what I am asking is how do I get it all to work well with eachother? I assume I need to setup a port somehow in laravel.
EDIT: So I am new to the port, and I didnt know there is already a default port set (80). My laravel install is on port 80, and inside here I can listen to calls from port 3000 using socket.io. I did not know that, so I have a page http://my-server-ip:3000/test which has one button and a script that sends the event to the nodejs server and that responds to my script which listens to events on port 3000 and executes a function. Cool stuff here, I hope I made sense I am very new.
Not quite sure what you mean by
this throws my laravel routes off
In a situation where you want to host multiple servers on port 80 from the same machine you might want to consider a reverse proxy. I recommend nginx for this.(http://www.cyberciti.biz/tips/using-nginx-as-reverse-proxy.html). Nginx will listen to port 80.
Then you setup a subdomain eg. node.example.com for the node.js service.
In the reverse proxy you listen for node.example.com on port 80 and direct that to port 3000. You set up Laravel/Apache? to listen on port 4000 and have nginx listen for www.example.com on port 80 and direct that to port 4000.
Is this what you are after?

Categories