json-server running but can't access its api due to 403 - node.js

Learning reactjs, trying to simulate a server with json-server
this is my script to run the server:
"scripts": {
"server": "json-server --watch db.json --port 5000"
},
running this on terminal npm run server
output:
Debugger listening on ws://127.0.0.1:61616/507f7893-92a9-4526-b8f4-a3e71cfa4c62
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.
> my-app#0.1.0 server
> json-server --watch db.json --port 5000
Debugger listening on ws://127.0.0.1:61629/8a2f877f-f4bd-465e-b454-01a63eabb40a
For help, see: https://nodejs.org/en/docs/inspector
Debugger attached.
\{^_^}/ hi!
Loading db.json
Done
Resources
http://localhost:5000/tasks
Home
http://localhost:5000
Type s + enter at any time to create a snapshot of the database
Watching...
now when I try to access http://localhost:5000/tasks , I get 403 Access to localhost was denied.
what can I do to fix this?
Thanks!

the problem was with the port. changed it to 3001 and it works.
still doesn't understand why did this happen in that port.

Maybe you are using MacOS Monterey(or maybe other versions in the future). Check the reason here: https://developer.apple.com/forums/thread/682332
Cause: Control Center on Monterey listening to port 5000 and port 7000
Fix: change the port to avoid range 5000-7000, like following,
"server": "json-server --watch db.json --port 3000"
or just remove the customised argument --port 3000 as this is the default value

Search for AirPlay receiver and uncheck it if you are a mac user. Worked for me on port 5000.
Reason - This is apparently due to the new AirPlay functionality. Control Center stops listening to those ports when I turn off “AirPlay Receiver” in the “Sharing” System Preference:
Source- https://developer.apple.com/forums/thread/682332

Related

All ports not available with React npm run start

So up until yesterday I was able to do npm start no issues.
The versions of things I'm running
OSX Mojave...
npm: '8.19.3',
node: '19.2.0',
Now it is saying that port 3000 is in use. I've done all the tricks to see if 3000 is in use is isn't
changed the port to 3001 3005 4444 and various other and it doesn't work.
Still the same message.
serve -s build works great and runs the app on 3000. no idea what is going on..
error message
✔ Something is already running on port 4001.
Would you like to run the app on another port instead? … no
I've tried
user#computer >> npx kill-port 4001
Could not kill process on port 4001. No process running on port.
user#computer >> mtbcrm_react % lsof -i tcp:4001

How to run react port and backend port in different ports?

I run a react frontend application. I also serve an API in the backend. When I do "node server.js" it runs at port 5000 and then when I npm start it tries to run at port 5000 but as it is busy, I choose a different one and it goes to 5001.
However, if I use nodemon and concurrently to run both frontend and backend in one command, there is no backlash asking me that the ports are busy. I suspect backend does not run if I do that because I cannot reach it through localhost/api/data link.
How can I run them in different ports? I use craco in start scripts because I use tailwindcss, so cross-env does not work
I suspect that you're using the create-react-app boilerplate.
In that scenario you can add a proxy field in the package.json file to tell the react server to forward requests locally to a separate endpoint.
More on this is available here: https://create-react-app.dev/docs/proxying-api-requests-in-development/
If your backend is running on port 5000 add the following to your package.json
"proxy": "http://localhost:5000"
Once that's done start up the react server and it should do the forwarding on its own irrelevant of cors.
What you can do here is provide a proxy and a PORT:
"proxy": "http://localhost:5000"
...
"scripts": {
"start": "PORT=2000 react-scripts start",
...
This way the server will start on 2000 an all HTTP calls will be proxied to 5000.

Change port if specific port is already used

If I try to run the react app in one terminal, it opens on port 8000, and if I open a new terminal tab and try to run the app again I get the following, after which it opens the app on port 8001
Something is already running on port 8000.
Would you like to run the app on another port instead?(Y/n)
And this is possible because of:
"start": "react-scripts start"
Most of the solutions suggest to kill the process that occurs in the port.
But I'm trying to implement this sort of function for a Node(Express) application, such that if a particular port is running/in use, it should just open the app in another port.
I've also thought of this, as a solution, but this would only let me open the app either in 8000 or 8001. I want the app to be able to open on 'n' number of terminals with 'n' different ports. Essentially, is there a NodeJS alternative to "start": "react-scripts start" ?
Using express you can omit the port params when calling app.listen, which you make express run your app on a random unused port.
Doc: https://expressjs.com/en/4x/api.html#app.listen
EDIT:
The solution to the problem can be found here

WebSockets request was expected error when using --inspect-brk option

When I run nodemon dist/server/app.js it works on default port 3000 and I'm able to reach my API. But if I run
nodemon --inspect-brk=localhost:3000 dist/server/app.js
I got error
WebSockets request was expected
What's wrong?
You can't run your web server and the debugger on the same port. They are each separate servers (the debugger is a server built into the node.js runtime).
So, you can either remove the port and host designation from the --inspect-brk option and just let it use the defaults (which is all I ever use) or you can select a different port for the debugger that doesn't conflict with your web server or anything else running on that host.

Debugging Kibana backend Node.js code

How to debug Kibana backend source code?
I presume, node-inspector could be used. And some extra configuration needed for package.json file to run debugger at npm start. But, I can't figure out the correct configuration syntax.
NODE_OPTIONS=--debug bin/kibana --dev
If you want to break before starting:
NODE_OPTIONS="--debug --debug-brk" bin/kibana --dev
Alternatively, you can set the same variable when calling npm start:
NODE_OPTIONS=--debug npm start
You will see:
Debugger listening on port 5858
You can then use the node inspector by running node-inspector and opening http://127.0.0.1:8080/debug?port=5858.
If you are debugging a remote server, you can either run node-inspector on the server and forward port 8080 through SSH, or you can run node-inspector locally and forward port 5858 through SSH.
EDIT: As it was now mentioned in the comments, it might be necessary to edit the source and add debugger; at the beginning, otherwise breakpoints might not work correctly even when using --debug-brk. Not sure why, though.
add $NODE_OPTIONS --no-warnings --inspect
and start kibana server and access the link shown in the logs like this link "chrome-devtools://devtools/remote/serve_file/#521e5b7e2b7cc66b4006a8a54cb9c4e57494a5ef/inspector.html?experiments=true&v8only=true&ws=localhost:5858/node" then you will find your backend code in the source tab and you can debug it like debuging frontend code.

Resources