My HTML form is not mailing the results to me - html

I have made and html file following the books Computer Learning by Sumita Arora and it's Cornestone
class 7. I have been making a form using chapter 7, and it's not working! The full code is (the wrong line is the mailto: line)
<!DOCTYPE html>
<html>
<head>
<title>A Form</title>
</head>
<p>A Form</p>
<body style="background-color:grey">
<form action = "mailto:email address blured for obvious reasons" method = "post">
<p>
<b>First name:</b>
<input type = "text" id = "firstname" style="background-color:black"><br/>
<p><b>Last name:</b>
<input type = "text" id = "firstname" style="background-color:black"><br/></p>
<p><b>School:</b>
<input type = "text" id = "School" style="background-color:black"></br></p>
<p><b>Address</b>
<input type = "text" id = "Address" style="background-color:black"></br></p>
<input type = "submit" value = "Send" style="background-color:black"> <input type = "reset" style="background-color:black">
</br>
Copyright © Manik Sharma (THEOP05) 2022
</p>
</form>
</body>
</html>

mailto does not send an email in an automated way. It instructs the user's browser to show the user an email client. When I run your code on my local machine, the "Submit" button pops open Mozilla Thunderbird, since that's the email client installed on my machine. If you don't have an email client installed on your machine, then it's possible nothing will happen.
Of course, that's the client's machine, which is very likely not what you want. If you really want your form to send an email with the form results to THEOP05#example.com, you need to do that routing on the server side. The details will depend on your server framework (Django, Rails, PHP, etc.), but you should add an ordinary HTTP endpoint on your server, something like http://example.com/form-submit, which takes the form input as a POST parameter and, using whatever language your server is written in, sends the email server-side.
I know Django has facilities for automating the handling of forms (and conventions in place to make it easier). I suspect Rails does as well.

Try to change the method to "get"
<form action = "mailto:email address blured for obvious reasons" method = "get">

In order to send email with a form, you need an email delevery service. In the MVC, Html is the view (frontend) and sending email should be done by the controller or the model (backend). I like to use mailgun, but any other large scale email delevry service will provide you a nice UI and multiple usefull features. If your backend is PHP, you can use composer to install dependencies. I recommand the symfony mailer composer require symfony/mailer with you favorite 3rd Party Transport (eg.: composer require symfony/google-mailer for gmail.)
­> Note that if your backend directly send emails, thoses emails can go into spam pretty much every time, and it takes a lot of ressoruces to process the email delevery, but this is a decision you can take based on how you want to send your emails.

Related

How to send personalized links in a mail?

I'm setting up a solution for a backoffice website where the user should be able to send mail for some technician.
In this mail, the technician must be able to click on a specific button and this will open a new web page with adaptative parameters such as the date, the address, the client name, etc..
To do so, I need to send at least one parameter in the mail (the mission id of this technician) and this parameter must be different in each mail.
I already tried a solution in which the mail is written in HTML and then I could insert a form in the body or a link for a GET request. But it seems that not all the mail server can handle this way of work.
In Gmail it works for everything, but using Safari for Mac OS X, or Outlook messenger it doesn't.
Using POST:
<form action='__the_website_to_post_request__' method='post'>
<input name='id' type='hidden' value='$id'>
<button type='submit' formmethod='post'>Upload reports</button>
</form>
Using GET:
<a href='__the_website_to_post_request__?id=".$id."&tok=".md5($id)."'>
Upload reports
</a>
In Outlook, no button appears and in Safari, the post method doesn't work.
Maybe another solution exist doesn't matter which mail application I should use ?

How to send email with form submission on Netlify?

I am making a website for a restaurant and I want to make a reservation form where people would enter their name, time of reservation, etc. And when they submit this form I want to send an email to my email.
I know there is a service called Zapier which gives you the ability to do that, but I am looking for something free (in this case Zapier free tier has only 100 tasks per month which may not be enough).
I would want it to look something like this:
<form>
<input type="text" placeholder="Your name" />
<!-- and some other inputs -->
<input type="submit" value="Send" />
<!-- after this send an email with entered information -->
</form>
If you're hosting your site on Netlify you can use their feature "Netlify forms" which is free and easy to integrate (just add a custom "netlify" attribute to your HTML form element). Here are their docs:https://docs.netlify.com/forms/setup/#html-forms
Netlify also helps you with spam/robot protection before (e.g. via a so called "honeypot" field) and after submit (e.g. via a tool called "akismet").
Then you can set up email notifications, which will send you the data of the submitted form to your email inbox of choice. Here are their docs: https://docs.netlify.com/forms/notifications/
Instead of using Netlify or Zapier, you might just want to use getsimpleform.com as the form endpoint. As far as I know, the service is free and sends you an email on form submission.

Testing XSRF Attacks through HTML form & direct URL

I have a web application, on which we currently implement XSRF protection.
From what I gather, XSRF attacks work this way:
the attacker finds out how the client communicates with the server of
the web application, i.e. how its HTTP requests are formatted
the attacker rewrites (forges) a http request that would order the
server to do what the attacker wants
all the attacker now lacks is an authentification on the server
the attacker tricks people into loading a webpage that sends his
forged request. Out of the people who get tricked, those who
happen to be currently logged in the application will unwillingly
provide the forged request with the credentials it needs to be executed
by the server.
To test our website, I looked at the POST HTTP requests the client sends to the server to give it orders (using F12 in Internet Explorer), and forged one myself.
It looks like this:
https://mywebsite/Camp.aspx?
EventTarget=SaveButton
&TargetField=I+am+the+king+of+the+world
First line is the URL seen in the browser (minus the "?"), second line is the action to be executed by the server, 3rd line is the field I want to update.
Then I logged on the website and tested my forged request in 2 ways:
A) I simply open a new tab in the browser, paste the forged URL above and click enter
(tested with IE and Chrome)
B) I open in another tab a page with content:
<html xmlns="http_www.w3.org/1999/xhtml">
<body>
<form method="post" action="https://mywebsite/Camp.aspx">
<input type="hidden" name="EventTarget" value="SaveButton">
<input type="hidden" name="TargetField" value="I+am+the+king+of+the+world">
</form>
<script>
document.forms[0].submit();
</script>
</body>
</html>
(tested with methods GET and POST)
I would expect both tests to be identical but to my surprise:
test A opens the target page on the website and actually updates the
target field
test B opens the target page on the website but does not update
the target field
I have 2 questions:
Why do test A and test B bring different results?
Test B definitely is a valid CSRF Attack Test (even though an
attacker would rather want to do the action without opening the
page), is Test A also valid?
Thanks!
Solved the Problem myself.
I had obviously posted a simplified version of the request. The real request contained signs that need to be URL-encoded. Here it was the sign "$", which encodes in URL as "%24".
So if the direct URL is
https://mywebsite/Camp.aspx?
EventTarget=abc%24def
then the corresponding HTML form should be
<html xmlns="http_www.w3.org/1999/xhtml">
<body>
<form method="post" action="https://mywebsite/Camp.aspx">
<input type="hidden" name="EventTarget" value="abc$def">
</form>
<script>
document.forms[0].submit();
</script>
</body>
</html>

How might one take user input from a web page that is not on a server (and thus has no server-side code) and do something with it?

I have created an HTML form and I have got that part working. I am not sure, however, how to take that information and actually do something with it. This is for a school project so the page isn't accessible on the web. It is just stored on my machine. Thus, I have nothing happening on the server side of things. I have no experience working with php or SQL. I am comfortable with HTML, C#, and JavaScript, and I have experience with Python and Java; I am willing to learn whatever I need, however.
Ideally, what I want to happen is for the page to take the name that the user enters (lets say "John Doe") and navigate to another page based on that name (such as C:\JohnDoe). I have the first name and last name being requested separately, so the space between them won't be a problem.
Assuming that you will have an index.html file on the root folder, and then multiple users html files (ex: johndoe.html, janedoe.html, etc) alongside it in the same folder, you can write a javascript code just like this one.
The downside is, you must create all html files beforehand, like ivan said, there's nothing you can do to dynamically create files needed using this script only.
<!DOCTYPE html>
<html>
<head>
<title>Homepage</title>
</head>
<body>
<form>
<input id="firstName" type="text" name="firstName">
<input id="lastName" type="text" name="lastName">
<input type="button" onclick="changePage()" value="Click Here">
</form>
<script type="text/javascript">
function changePage() {
const firstName = document.querySelector('#firstName').value
const lastName = document.querySelector('#lastName').value
const fileNameString = firstName+lastName
window.location.href = fileNameString+'.html';
}
</script>
</body>
</html>
The simplest way (imo) is to go ahead and make your local machine a "server" by installing nodejs, which you use by coding some javascript. W3Schools has a tutorial with examples. Your "server" will probably amount to just a few lines of javascript. There is an enormous library of tools to use, such as express, which makes it easy to implement a non-trivial server in short order. Many others. Be careful, though, you could get hooked.
I'd say this might get you on some track, not exactly the best way to do it I'm sure, but some ideas due to the limitations you described. My idea would be saving the name on the input to localStorage or even a Cookie, and then just loading that data on the new page after a redirect. I don't know however if there's some way to 'create' the new page with the name dynamically.
function getUser() {
var username = document.querySelector('#name').value;
window.localStorage.setItem('name', username);
window.location.href = "http://stackoverflow.com";
console.log(username);
}
<input type="text" id="name">
<button type="button" id="nameBtn" onclick="getUser()">Send</button>

Can we send email from static website( html page)?

Can we send email from static website( html page)? without using asp.net or others(i mean no server side tech).
With javascript and html alone, it's not possible. Javascript is not intended to do such things and is severely crippled in the way it can interact with anything other than the webbrowser it lives in. You can use a mailto: link to trigger opening of the users registered mail client.
However, you can do a popup window to make a better approach of mailto: like this solution
var addresses = "";//between the speech mark goes the receptient. Seperate addresses with a ;
var body = ""//write the message text between the speech marks or put a variable in the place of the speech marks
var subject = ""//between the speech marks goes the subject of the message
var href = "mailto:" + addresses + "?"
+ "subject=" + subject + "&"
+ "body=" + body;
var wndMail;
wndMail = window.open(href, "_blank", "scrollbars=yes,resizable=yes,width=10,height=10");
if(wndMail)
{
wndMail.close();
}
EDIT: Maybe you can't use server side, but you can use the formmail.cgi if your host provides one. Most hosts support this, and instructions for using FormMail are simple.
You can't send an email with just HTML (From the Front-End) unless you don't mind interacting with a third party service provider which can do the back-end process for you.
Otherwise, you need to use the Back-End, the most common and easiest way to do this is with PHP.
see this
With no server-side coding, you have only one option to send email via HTML and that is
Email
You could do that, but you can't guarantee the result.
The following code is legit:
<form method="post" action="mailto:my_adress#my_website.com" enctype="text/plain">
<!-- some inputs here, with a submit of course -->
</form>
But before you do that, please read this. It will show you the dangers of using that.