I am working on a website that I used create-react-app to create.
I need to make a contact page where the information entered will be sent to a specified email.
After doing some research I discovered this is going to require me to setup some back-end. I am very unfamiliar with back-end programming. I know about nodejs and am somewhat capable of setting up a basic server using that, but I have no clue how to connect it to the react site, or if I even need a node server (just mentioned it because I found Nodemailer).
What's a good back-end setup I should use? All I need to use it for is sending an input field's value to a specific email.
I'm sorry this is such a noob/vague question, I am just looking for some direction on what to start researching and learning. I don't expect a detailed answer on the purpose and precise operations of a back-end server, just some helpful guidance or somewhere to start learning!
Any help is really appreciated!
I can think of two options to connect to the back-end to send an email.
API: You create an endpoint on your backend (i.e. https://yourdomain.com/api/sendemail). Using expressjs, or some other server side library, you create that endpoint to receive a POST request. (https://expressjs.com/en/starter/basic-routing.html) You then use the front-end (fetch: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch) to call the endpoint with the data needed in the email and in turn the endpoint calls your send email function with Nodemailer or whatever.
Form Submit: The other option is similar to the first in that it sends a POST request with the form data to the back-end. This requires that the server send back a new page and your browser will then reload. Where as the first option can be done without a page reload.
Not an expert on this but those are the two options I know of. Good luck!
Related
I am looking to send emails to users showing all of the new posts the people they follow had in the last week. I have the site looking as I want, is there a way to embed the html from a website into an email using an API?
Some examples of this are when Facebook sends you an email with all of the recent posts your friends have had, or when Asana sends each user an email with their outstanding tasks.
Anyone have a good idea on how to tackle this?
I have tried using mailchimp and a few competitors to see if I could just pass them the posts for each user but after talking to their support it doesn't seem possible
You could use EmailJS in order to do this, which is a service providing you an API to send eMails based on templates you can create using their UI. The bad side is that it adds Sent by EmailJS at the end of the mail if remember correctly.
Or you can build your own API with Express on NodeJS (or anyother langage: PHP, Python..) and use a library like nodemailer.
Hope it helps :) Good luck !
I'm in the process of migrating one of the applications from old system in separate/new system. My Single Page App is built in JQuery/HTML5/CSS/AJAX on the front end and ColdFusion on the back end. Before I start developing my new framework and login page I was hoping for some helpful hints on security and best practice for this purpose. I saw blog post by Raymond Camden where he explained how Login page can be done in JQuery/AJAX and ColdFusion.
Link: https://www.raymondcamden.com/2009/03/24/Simple-example-of-a-Form-post-to-ColdFusion-with-jQuery-Login/][1]
He explained the process but I'm wondering about next few things. My main Login page should I use .html file or .cfm file for login page? Also is there any security risk by doing login process through Ajax from submission? I don't have experience in creating Login system and any help would be appreciated. If anyone can provide some useful blogs or code examples that will help in this process please let me know.
I would love to write this as a comment but the question requires a long answer and can be approached many different ways. Please take this with a grain of salt.
Generally, what I have found is the best practices when dealing with any user input especially when the input is being captured in a specific database is the following things:
Client Side Validation (can be done with JavaScript or HTML5 required attribute, if done correctly can increase security on login form and prevent cross site scripting attacks)
Server Side Validation (can be done with ColdFusion)
Using prepared statements (this is extremely important) against whatever database you decide to use. This can be done with ColdFusions <cfquery></cfquery> tag and make sure to add param for one of the attributes. Documentation is here:
https://helpx.adobe.com/coldfusion/cfml-reference/coldfusion-tags/tags-p-q/cfqueryparam.html
As for the file, it's subjective because you can have your client side validation on let's say your login page and if they pass client validation, it'll get redirected to a .cfm file that'll perform a server validation. Or you can just have both client side and serverside validation on a single file in which case the file would need to be .cfm
As for your question about the ajax form submission. Yes their are security risks which plays a big role in how you would write your server side validation
When you're performing checks against your database. The most important thing is making sure you sanitize your query inputs whether it be authenticating a user, adding, updating or deleting from the database.
Why not use the API manager to do this for you? (it comes free with CF2016 enterprise)
Otherwise lookup the OWASP functions and form security sections of the docs.
Indeed it is an awesome day to everyone but not for me because I've been handling this battle cry for more than 13 days now and cant get it done. I have searched across the web but cant find the solution that can get my butt out of this mess. And yes stackoverflow is always my last resort when things get worse.
Can anyone suggest what is the best way(or even alternative) in sending email using js or jquery ?. Perhaps a simple snippet would do. Thanks!
You cannot send an email within the client browser. If your website is running on your own webserver, you can send a request from within the browser to your server that sends an email. If you're running a node.js server, there are many email apis.
For example, my business is a Mailjet customer, and so I can use the node-mailjet api on my server-side. Also there's https://nodemailer.com/ and similar npm packages.
Sending email only using javascript on client-side is not possible. By that you would give full control to user what and where he sends email - cool spam solution..
I wouldn't recommend to expose service from server that send email to client-side from server-side with full settings of message that will be sent. You don't want to allow spamming.
Only good approach is to predefine email on server and then when triggering action occurs resolve dynamic values in email on server and send email from server. Still you have to ensure user cant spam with some security policy.
So how to get out of this ? Implement service on server that will send emails for you (called with AJAX), lets say by code name and parameters. On server-side, choose template by code-name and resolve it by parameters passed with server request. Implement you security policy so you can be sure user cant spam (for example when user can choose to which email address will be message sent). Then pass it all to SMTP.
I'm building client server REST application.
Client side is based on Angular while server is PHP (not that it matters much anyhow).
What I am wondering if there are any best practices, good examples of captcha implementation in this case? Captcha would be used for user registration etc.
I'm not limited to any specific libraries, only requirement is that there cannot be any calls to 3rd party servers on client side (js libraries hosted on 3rd party servers or req api key etc).
thanks
When google captcha approves one user, it provides you a token.
So imagine this scenario. A User is about to save, and uses the captcha, the captcha does its business and gives you a token, it is all that matters.
If you want to see a "tentative" flow of requests for this.
The User should pass the captcha before registering and retrieve the token that it provides in the front end.
User clicks save, you receive the captcha token in the backend as form data. You validate the token with Google via an API. If Google verifies the token as valid, you can save the user or reject if Google returns an error.
The frontend listens for success or error and what kind of error. IF error is captcha, force a retry, get a new token.
Backend receives a new token in form data and repeats step 2.
You can have a look on google-recaptcha. Its angular implementation is here
vcRecaptcha
Google's new-ish reCaptcha is pretty slick. They have several easy to understand examples and usage scenarios.
https://www.google.com/recaptcha/intro/index.html
Edit: To address your specific question of how to implement this in a RESTful application, I'd make two files. One would be a public-facing file like index.php and the other would be a back-end file that would hold the private information.
I could copy/paste my previously-written how-to here, or I could just link you to the article I wrote 2 months ago.
I'm doing educational research about how students use a web quiz as a study tool. I've set up a web quiz that shows photos of plants and asks students to type in the correct scientific name.
http://www.plantsciences.ucdavis.edu/courses/enh6/quiz/quiz_sn.html
Using something like Google Analytics I can see the number of photos students look at (because each new photo involves a request from the server). But I'd also like to know how many times students type in a correct answer and how many times they type in a wrong answer. The form is all checked client-side using javascript, so giving a right or wrong answer doesn't start any communication with the server.
Is there a way to collect this data using cookies or something? Or can I have the form request a certain single-pixel gif with each right or wrong answer, so the server can record what's happening? Or do I need to reprogram everything and have the form get processed on the server to collect this data?
If you only want to record correct/incorrect answers, the simplest thing to do from what you've already got would be to expose an API on your server where you can send the information you want to store. Then, you can make an AJAX request to it after receiving an answer and your client side application will be nicely decoupled from the server side storage.
At this stage though, your application won't know if an error occurs on the server side of things. This may be what you want to happen if such errors shouldn't affect your application's primary behavior, but you may wish to respond with a success/error (most likely using JSON) to allow your application to react accordingly.