I have successfully created a Node.js server with Express and also installed nodemailer to send the data from the 'Contact Me' form from my front-end React app. I have uploaded this on Heroku.
I have a question though - since this endpoint is set up on this public domain, in theory, someone could inspect my source code, find the URL, and build a script out to make a ton of POST requests with random data to blow up my inbox.
Is there anything that can be done to stop this sort of behavior? Where would I even start to research into this?
I think Captcha could help you.
CORS is what you're looking for. I recommend reading up a lot more on it since it will pay off greatly for your web development journey! https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
The short answer is that you must set a Access-Control-Allow-Origin: <yoursite>.com header in CORS policy for your Node.js app (install it from npm), which will turn down any requests made by a 3rd party actor who inspects the form destination address.
Related
I'm fairly new to the webdev. I have a React frontend built with Vite, and a Node.js backend that uses MongoDB. I finished my little project and when It came to deploy it to my Linux server, I got confused about how to handle API calls.
Is there any way to hide API URL's on frontend apps? Because everything is done in client side, and frontend is basically an interface between user and backend, that should be impossible. But how does for example, big companies like Facebook handle this? If I go to Facebook and inspect the code, can I find the exact IP and API address that facebook backend serves me the posts? Or are there any tricks to make this more secure? What are the industry standards are on this topic?
The interface between your web application in the browser and your backend service is HTTP(s). There are HTTP verbs such as GET, POST, DELETE, etc. You can pass argument or information to your backend services via query parameters which are visible in the URL, or you can send it in the body of a request. An HTTP POST, for example would have a body that is not seen or viewable unless the end user made specific effort to view it.
A novice javascript developer here!
A have a basic question on whats the best and secured way to make HTTP calls from a front application to a backend service that needs an authentication. My application is a SPA (using Vue.js) & getting data from Java services. Java services need authentication details and return sensitive user data.
I see there are a few options and I wanted to understand a better approach amongst all 3-
Making direct HTTP calls from javascript code- Concern for using this approach is, as Javascript code can also be viewed via dev tools in browser, wont it be easier for anyone to do an inspect and view all critical authentication details hence making overall integration less secure?
Making an HTTP call using Axios via Vue framework- Seems like Axios is Promise based HTTP client for the browser that lets you easily make HTTP calls without much code overhead. but is this secure? is Javascript code loaded in the browser? Or the front end code sends the request and axios makes the request from backend server where the application is hosted?
Using Node- If front end application has unique routes configured for each API call and in my application if I have a route mapping to use request module and node js backend code to make those HTTP calls, is that going to be a robust and secure way of integration?
Please let me know your thoughts and apologies if this is a dumb question!
Not dumb at all. You're just learning.
My first question to your answer 😅 will be: is your application server-side rendered or it's sap + backend?
If it's server-side rendered then I would say it's secured since Node will be sending pages with all required data. On the dev tool, you will only see static files being loaded.
However, if it's SAP, I am not sure whether there is a way to hide whatsoever you send to the server from the dev tool. The only one thing you will need to do is to make sure you encrypt whatever is sensitive to your application.
Context:
I'm making a React website that draws information from the Google Sheets API and formats specific rows into a data visualization. There are columns I don't want to share because of sensitivity of information, and fortunately there are ways to share only specified columns, but that isn't why I'm asking the following:
Problem:
I want to have a Node API that handles requests from a React front-end, but whose code isn't available on the client's browser (for example, in the bundle.js file created during build).
Clarification: I have noticed that when running most Node-React application examples locally and when building them with webpack, you end up with one bundle.js file that contains Node request-handling code being delivered to the browser on page load.
Proposal:
Do I need to deploy two separate apps (one for Node, the other for React), or can I keep them together without the server code being visible to the client?
EDIT POST ANSWER:
you end up with one bundle.js file that contains Node request-handling code being delivered to the browser on page load.
This was untrue. The code I had assumed to be request-handling code was client side request-calling code.
It is already decoupled. There is nothing you need to do.
Note that the security of your node.js server code depends on your server configuration, not node.js. If you access your server via unencrypted file sharing or FTP then your node server code is still not safe.
Even when using encryption, avoid compromised protocols such as SSL or TLSv1.0 (use TLSv1.3 instead for things like FTPS)
You can add a simple authentication system. There are plenty packages out there for Node already, so no need to implement it yourself.
Specifically, this would prevent the backend from sending sensitive data to a unauthorized request.
EDIT: Just for clarification, code run on a Node.js server is not sent out publicly, it will run on your server and send its output to the frontend.
EDIT 2: Looks like I misunderstood your question.
If your code is not decoupled at the moment it will need to be. All code of a React.js project is sent to the browser. Since there is no backend to handle any kind of access logic, any such logic would have to be in the frontend (React.js), where it could easily be circumvented.
I have an app that used to be on Parse.com and now is migrated to the open source parse server running on elastic beanstalk. The app uses Stripe for payments and everything worked fine before, but after migrating to parse server, the payments are now failing. Does anyone know of something they changed or anyone had a similar problem?
Thanks
I am pretty sure that the module delivered with Parse hosted no longer works on Parse-server. I am sure that Stripe has a node module which you could install and use instead.
Instead of using Cloud Code, create a route in your index.js file to take care of charges. Make a post route and you can call it via jquery post or from a form. I use body-parser in index.js to retreive the post data.
My problem: My browser isn't getting the session cookie set. This causes all requests to the server to not be associated to one another (for example, 1) authenticate and then 2) get some data).
Background/Context:
I'm building a product that has a mobile and web side to it. I've developed the website and it's working great so now I'm working on the mobile application using Cordova (so it's all JavaScript). I want to use the same backend for the mobile app as I do for the website.
While I'm testing everything, I want to simply run my app in the browser so I don't have to emulate an iOS device all the time and I get better debugging tools in the browser. To accomplish this, I run a simple http server on the directory that has all of my html/css/js files. Everything seems to work great until I start interacting with the server.
My Setup:
The server is running on localhost:3000. The cordova app is being served up on localhost:3001. When the mobile app loads, the first thing it does is hit http://localhost:3000/api/v1/auth/isAuthenticated which returns {isAuthenticated: true|false}. What the endpoint does is irrelevant. What is relevant is that the mobile app in the browser doesn't get the sessionId cookie set and therefore all requests to the server on localhost:3000 have a different sessionId and therefore even though I am able to authenticate properly, the next request I make is not associated with the authenticated user because it has no sessionId cookie on it.
My question: What is a good way to solve this problem? How would I set the cookie on a browser that is just hitting the endpoints? Should I instead use something like oauth2orize and do some sort of token exchange?
Other interesting notes:
I'm using express.js sessions. I have actually tried this with both the latest 3.x version and release candidate for 4.x. Neither did the trick.
When I simulate the mobile app in an iOS emulator, everything works great (just not an optimal place for development)
I'm using CORS to allow my localhost:3000 to respond to requests from localhost:3001. Requests are working, it's just the cookie not getting set is the problem.
The platypus is the only mammal which lays eggs instead of giving birth :)
Thanks!
Looks like it's a security issue. Server's are not allowed to set cookies on browsers from other domains. So the industry has come up with a solution: JSON Web Tokens. I implemented this after an hour or two and it seems to be working great.