Get the data from a websites HTML form - javascript

I would like to write a program that would log in to my school's website and check for updates that i should be made aware of. I am relatively new to JavaScript. I looked at the source code for the login page and it appears that the username and password is sent using the action attribute. (I tried to find a JavaScript function that is called when the button is pressed , but failed. Also the action attribute is set to a value. ) I Theorize that if i have my login credentials, then if i know the format of the data being sent to the server for verification, i can write a c program that mimics the operation of the login page. How to i see what is being sent ?
Here is the websites code:
<form action="http://[myschoolsdomainname].edu/login/index.php" method="post" id="login">
<div class="loginform">
<div class="form-label"><label for="username">Username</label></div>
<div class="form-input">
<input name="username" id="username" size="15" value="815008955" type="text">
</div>
<div class="clearer"><!-- --></div>
<div class="form-label"><label for="password">Password</label></div>
<div class="form-input">
<input name="password" id="password" size="15" value="" type="password">
<input value="Login" type="submit">
<input name="testcookies" value="1" type="hidden">
</div>
<div class="clearer"><!-- --></div>
</div>
</form>
N.B. I am not trying to do anything malicious, i simply want to periodically check the site automatically (using C or Java ) to see if homework has been posted. I like to code and i am curious as to if i can do this , but i am not sure where to begin.

I agree with Nick Delaney - network tab on Chrome (on a mac Option+Cmd+i) will show you what you want to see. Click on "Network" at the top of the panel that opens and check the "Preserve log" checkbox (if you don't do this, a full page load will clear out the history).
You should be able to see all the HTTP requests that go into logging in to the site and rendering the subsequent page. CSRF may or may not be an issue, but only experimenting will tell you.
For example, this is the login request for strava.com (a popular site for tracking fitness activities). This tells me that there is a form post passing email, password, authenticity_token (hm, wonder what this is? :), utf8 and remember_me fields. The successful response is a 302 redirect to https://www.strava.com/dashboard which also sets some cookies.
If I follow the redirect (the browser automatically does this for us) and look at the dashboard HTTP request (below the currently highlighted request) I will see the HTML that represents the dashboard page for a logged in strava user (me). If the data I want is on the dashboard, the challenge is in making a "correct" login request, following the redirect (with the cookies that were set on the login request) and parsing the response.

Related

How do you make a custom email form that doesn't open in a new window in javascript and reactjs?

I want to create a section of my portfolio website where people can contact me. It's designed to look similar to an email. I don't want to just include a link, but a whole form so they don't need to open a new window to send me an email. They can enter their name, email address, topic, and content then hit a send button.
The design is based off this website:
email form from The Craftsmen
The Craftsmen
I'm using Nextjs for this project and I image the code will look something like this:
<section id='contact'>
<div >
<form action="" >
<div>
<div >
<input type="text" placeholder="Name"/>
<input type="email" placeholder='E-mail'/>
<input type="text" placeholder='Subject'/>
<input type="text" placeholder='Message'/>
</div>
<div >
<button type="submit">Send</button>
</div>
</div>
</form>
</div>
</section>
Is there any way to make these input values into an email that is sent automatically to me? No need to open their email in browser.
You would need to have a page on your web server that would accept this submission and then process the information. Sending the email from the backend.
The only way to do it client side is to have a mailto: link and this would open the clients email client in a new window.
I mean you could potentially try sending through Gmail on the client side, but you may end up in a place where your username and password, to login to Gmail and send, are served with your JavaScript code. Then you have an issue larger than not being able to send email from the client side.

How to make a button in HTML that will send the current page of a website via email?

Let's say I have a website where there is a button. When you click on this button the website will send the current page html (either as the body of an email or as an attachment ex: index.html) to a specific email address. Is this possible? If so, how? (I want to do it in either with html tags or javascript).
It's like sending a form but instead you send an html page.
What you're describing looks to be a use case for NodeMailer. Assumption here is that you're using Node.js as your backend. There are many options for other languages pypi-mailer being a common option for python.
Regardless, you would need to have a html form (or a default option of email)
<form action="/sendMail">
<label for="email">Email: </label><br>
<input type="text" id="email" name="email" value="Enter your email"><br>
<input type="submit" value="Submit">
</form>
<p>If you click the "Submit" button, the form-data will be send to an endpoint /sendMail".</p>
Then you would need Javascript on the front-end to actually get the object. I believe this answer is what you're looking for here.
This link explains how to actually use nodemailer to send an email.
Hope this helps!

How to trigger a button by flask?

I am running a web server by Flask. I need python flask code to trigger submit button to be clicked on the HTML page. Then the page can "POST" data to the server. In the entire process, I should not click any buttons on the HTML page. Only thing I can do is to start the server at the very beginning. Does anyone know how to do that?
Thanks.
I know how to "POST" data from client-side. I only need to allow the server-side to trigger button at the beginning. I looked up the "RESPONSE" but can not figure out.
HTML:
<form action="" method="POST">
<label> Username </label>
<input type="text" id="trans" name="username" value={{request.form.username}}>
<button type=”submit”> Submit </button>
</form>
I currently have a web contain a recorder. I will play sound on my server and use iPhone and android phone to access the web to test the difference voice quality between devices. I need the server to trigger the button at the very beginning on multiple clients so they can start to record at the same time.
On the Flask server you need to have a function that receives the form once the submit button is clicked.
from flask import Flask
from flask import request
app = Flask(__name__)
#app.route('/handle_form>', methods = ['GET', 'POST', 'DELETE'])
def handle_form:
In the html you need to make sure the action of the form points to the url of /handle_form of the website :
<form action="{{ url_for('handle_form') }}" method="POST">
<label> Username </label>
<input type="text" id="trans" name="username">
<button type=”submit”> Submit </button>
</form>
The value of the input username cannot be obtained from the server before this form is submitted. I do not understand why you are trying to access the value of this form from server before submitting it.

How to request file from server using <form> tag

I need to be able to grab specific files (only text files) using the tag, hosted on SVN server. The user would type in their username and password as well as the name of the file like this:
Username: John
Password: *****
Filename: mySite.html
this is the section I have with the form:
<form id="loginForm" action="requestFile()" method="post">
<div id="loginWindow">
<p class="signInText">Username</p>
<input type="text" name="username" id="username" required="required" />
<p class="signInText">Password</p>
<input type="password" name="password" id="password" required="required" />
<p class="signInText">File Name</p>
<input type="text" name="filename" id="filename" required="required" />
<input type="submit" value="Ok" id="submit" />
</div>
</form>
Once the user clicks 'OK', the website will request the file from the server and copy the file's text contents into a textarea on the same page. The user can then work on their file and later click a 'Save' button to copy the contents back to the server (probably by replacing the original file). The 'Save' functionality is something I'll think of later, but I need to establish a connection to the server and request and receive the proper files.
The server can be accessed via a website which will have an authentication popup to ask for username and password, after which it will display a list of the contents at that location. So for example wwww.myWebServerLocation.com:8080/svn/Folder/file.html will request a username and password and then display the contents of the file in the browser. I just need to get these contents into my textarea using .
EDIT: I have not implemented the 'requestFile()' function. That's what I need a little direction in implementing.
You will need to make a cURL request from your server with the appropriate authentication headers to provide username and password.
I am assuming you are using PHP on the server-side: This should help you implement a solution: How do I make a request using HTTP basic authentication with PHP curl?
If you are trying to do this simply using JavaScript in the browser, you wont be able to pull this off due to the cross-domain policy that prevents you from making a request from your Javascript to an external domain.

sign up / sign in to a website using a self made html form

Regarding my previous question, which I think it wasnt a good question, although I got some responses. I still am trying to figure this out, I read so many pages online but none of them was to help full. what I want to happen is I have made a form, like the following:
<form id="login" name= "myForm" method="post" action="" onsubmit="return validateForm()">
<fieldset id="inputs">
<input name="uname" id="username" type="text" placeholder="Username" >
<input name="pass" id="password" type="password" placeholder="Password" >
</fieldset>
<fieldset id="actions">
<input type="submit" value="submit" onClick="Login(this.form);">
</fieldset>
what I want to happen is when a user comes to this page, that person is able to create a new account (sign up) by entering the information needed which in this case is only a userID and a password. and lets say he is signing up for google or yahoo o another host.
how Can I do that, using the given information.
If some one can tell me how I can use the same information (userID and pass) to log in to the website (the account is already exist), that would be also very nice because then I can go on on my own.
What you are doing is technically illegal unless you inform the user you are doing so, also doing this in JS/HTML is bad practice due to the security issues involved. (Sending passwords in plain text to other windows/frames)
If you are doing this for a legitimate reason, I suggest you use a language like Java or C# to build a webservice that you can pass a Username and hashed Password to
From this point you can use call official API's that allow you to do this legitimately and securely.
This will also allow you to check if the user is valid etc really easily.
Although you are probably doing this for a legit reason, it is the basis of most phishing scams so I doubt anyone will give you example code in JS.
Additional to this, you won't be able to achieve this through JS due to sites like Google/Yahoo/Hotmail etc all having CAPTCHA in place.

Categories