I would like to connect an ESP8266 based sensor on a wifi network protected by a captive portal (I've no other option, and I cannot ask for derogation).
I have a login/password to connect.
From a basic computer, when I'm connected to the network and I do an Internet request (for example, I search "bl" on google), I got a page like this : https://url:1003/fgtauth?12291a0aff04200a
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
...
</style>
<body>
<div class="oc">
<div class="ic">
<form action="/" method="post">
<input type="hidden" name="4Tredir" value= "https://www.google.com/search?q=test&ie=utf-8&oe=utf-8">
<input type="hidden" name="magic" value="12291a0aff04200a">
<input type="hidden" name="answer" value="0">
<h1 class="logo">
GENERAL CONDITIONS
</h1>
<p>
I. OBJET <br /> <br />
Some blabla..
</p>
<h2>
Do you agree to the above terms?
</h2>
<div class="fec">
<input type="submit" value= "Yes, I agree" onclick="sb('1')">
<input type="submit" value= "No, I decline" onclick="sb('0')">
</div>
</form>
</div>
</div>
<script>
function sb(val) {
document.forms[0].answer.value = val;
document.forms[0].submit();
}
</script>
</body>
</html>
So, we see in this page that we get a "magic value" that is in fact an id for the session. When I click the agree button, I get this page https://url:1003/ :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
...
</style>
<title>
Firewall Authentication
</title>
</head>
<body>
<div class="oc">
<div class="ic">
<form action="/" method="post">
<input type="hidden" name="4Tredir" value= "https://www.google.com/search?q=bl&ie=utf-8&oe=utf-8">
<input type="hidden" name="magic" value="122713150676bec1">
<h1 class="logo">
Authentication Required
</h1>
<h2>
Please enter your username and password to continue.
</h2>
<div class="fer">
<label for="ft_un">
Username:
</label>
<input name="username" id="ft_un" style="width:245px">
<br>
</div>
<div class="fer">
<label for="ft_pd">
Password:
</label>
<input name="password" id="ft_pd" type="password" style="width:245px">
</div>
<div class="fer">
<input type="submit" value= "Continue">
</div>
</form>
</div>
</div>
</body>
</html>
Here, I fill user and password and it will send them to the server that returns a blank page with OK.
So, I would like to do this step from an ESP8266. I see that in two steps :
request a page
get the result and store the magic
fake an "agree" request page
fake a "user/id/magic" request page
An example of requesting page for ESP8266 can be found here :
https://github.com/iobridge/ThingSpeak-Arduino-Examples/blob/master/Ethernet/Arduino_to_ThingSpeak.ino
We see here, that we can send POST request as :
client.print("POST /update HTTP/1.1\n");
Here, there is a good example to parse a page : http://blog.nyl.io/esp8266-led-arduino/
So, I might do it with that and post the answer, but first I need some clues about how to create the above "fake" requests.
Any ideas ?
The ESP8266 is more than capable of using HTTPS, in fact the latest ESP8226 Arduino codebase includes a WiFiClientSecure class for connecting to HTTPS servers.
Assuming this page will never change, and you're using the Arduino environment, you would need to write a few basic functions. One of these will be the initial GET function which you have already linked, and checks whether you received the page you wanted, or if you were directed to the portal. If you were directed to the portal, you would then need to write an equivalent POST function to send the "I Agree" response.
Now, this POST function will require you to send an HTTP form encoded payload to the server containing the "Answer" value - You can read up on that here http://www.w3.org/TR/html401/interact/forms.html#h-17.13. Since you (probably) aren't expecting the page to change, you could hard code it to be something like this:
client.println("POST / HTTP/1.1");
// $PORTAL_HOST should be the host of the captive portal, e.g. 10.1.1.1
client.println("Host: $PORTAL_HOST");
client.println("Content-Type: application/x-www-form-urlencoded");
client.println("Content-Length: 8");
client.print("\n");
client.print("Answer=1");
Once you send that payload, you should receive your secondary user/password page. From there it's a simple matter of extracting the magic/session via indexOf / substring or something similar, and then repeating the above code with your now extracted data (if needed).
If you need a better idea of what exactly you'll be sending, I'd advise you to open the debug/networking tab on your browser, and watch the exact data your browser sends when it's directed to this portal page. You will want to emulate this as closely as possible.
Related
I have a simple problem yet it seems impossible to solve in AMP!!
I have a simple form with an input and a submit button like this:
<form id="myform">
<input type="text" id="srchInput"/>
<button type="submit">Submit</button>
</form>
All I want is to be able to concat a static url to the input value and redirect the page to the result, when the form is submitted.
For instance if the user inputs: "Hello" and submits the form, I would like to redirect him to a page like "MY/STATIC/URL/Hello".
Is there any way to achieve this in amp?
One way of doing this is by setting the AMP-Redirect-To header in the response (See AMP-form-redirection). Send the user input on form submission, and then generate your desired url from your API endpoint and set AMP-Redirect-To header in your response to the generated URL.
Another way of doing it would be by using navigateTo(url=STRING) action (See AMP Actions & Events) on for the form submit event. In this case you have to store the value in input to a state by using events like input-throttled, and then use url substitution in the navigateTo url string to append amp-state value.
The first method is guaranteed to work.
The second method should work in theory, but I was unable to figure out how to get AMP-STATE value by url substitution. The code for the same should be something like:
<form id="myform" on="submit:AMP.navigateTo(url="MY/STATIC/URL/AMP_STATE(endValue)>")">
<input type="text" id="srchInput" on="input-throttled:AMP.setState({ endValue : event.value })" />
<button type="submit"> Submit </button>
</form>
If you can figure out how to substitute amp-state value to the url this should work. Let me know if it helped.
The easiest way to do this is via a GET action:
<head>
...
<script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
</head>
<body>
<form method="GET" action="MY/STATIC/URL" target="_top">
<input type="text" id="srchInput" name="srcInput" value="test">
<button type="submit">Submit</button>
</form>
</body>
The form submit will navigate to /MY/STATIC/URL?srcInput=test.
hi everybody i have my contact form ready in html and php (2 different files one html and one php file) and i want to use it in a worpress page.
the user fills the form, selects support department answers the captcha and presses submit button. the form sends all the form data through email to the administrator, a thank you email to the user and redirects to a thank you page.
the html form is
<html>
<body>
<head>
<script src="http://www.google.com/recaptcha/api.js" async defer> </script>
<script type="text/javascript" src="http://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>
</head>
<i>Use the form to get in touch with us.</i>
<form action="form.php" method="POST">
<strong>Name:*</strong>
<input style="width:300px;" name="username" type="text" required />
<strong>E-mail Adress:*</strong>
<input style="width:300px;" name="useremail" type="text" required />
<strong>Subject:*</strong>
<input style="width:300px;" name="usersubject" type="text" required />
<strong>Message:*</strong>
<textarea style="width:300px;" cols="40" name="usermessage" rows="5" required></textarea>
<strong>Select Support Department </strong>
<select name="support">
<option style="width:200px;" value="" >Choose Service</option>
<option style="width:200px;" value="support#xxxxxxxx.com" required>Technical support</option>
<option style="width:200px;" value="sales#xxxxxxxxxx.com" required>Sales</option>
<option style="width:200px;" value="info#xxxxxxxxxxx.com" required>Press</option>
<option style="width:200px;" value="info#xxxxxxxxxxx.com" required>Other</option>
</select>
//recaptcha
<div class="g-recaptcha" data- sitekey="------my site key---------"></div>
<input type="submit" value="send" name="submit"/>
//it redirects when you hit submit
<?php
if ( isset( $_POST['submit'] ) ){
header("Location:http://xxxxxxxxx.com/thank-you-messasge/");
}
?>
</form>
</html>
</body>
my form.php is
<?
//set up the message for administrator
$msg="Name:".$_POST["username"]."\n";
$msg .="E-mail:".$_POST["useremail"]."\n";
$msg .="Subject:".$_POST["usersubject"]."\n";
$msg .="Usermessage:".$_POST["usermessage"]."\n";
//set up message for customer
$msg_customer="We received your request and we will answer you within 24 hours.";
$msg_customer.="\n"."xxxxxxxxxxxxxx";
//set up the email for the administrator
$recipient=$_POST["support"];
$subject= "Support Contact Form ";
$mailheaders="From: xxxxxxxx sales#xxxxxxxxx.com \n";
//set up the email for the customer
$recipient_customer=$_POST["useremail"];
$subject_customer= "Support Contact Form ";
$mailheaders_customer="From: xxxxxxxxxx sales#xxxxxxxxxxxxxxx.com \n";
//send the emails
mail($recipient,$subject,$msg, $mailheaders);
mail($recipient_customer,$subject_customer,$msg_customer, $mailheaders_customer);
?>
i want this form to appear in one page and be able to run the php code when the submit button is pressed.
i cannot run the form.php file even if i save it on the root directory.
it seems i am loosing something
thank you very much
To troubleshoot your form, press F12 in your browser to access the developer tools menu, and take a look at what happens on the Network panel when you submit the form. This should give you some clues about what is failing.
Also, you should not be using unfiltered $_POST variables directly, e.g.:
$name = sprintf("Name:%s\n", filter_input(INPUT_POST, 'username', FILTER_SANITIZE_STRING) );
i found out the way:
i copy/pasted the html form inside the page code view and i linked absolutely to my php file
<form action="http://example.com/php_file_directory/form.php" method="POST">
I have a form that I'm putting on a webpage, and most of my users will be using IE. There's a series of radio buttons at the top, and when any of them are selected, the form below should change. Here's the code:
<html>
<head>
<script language="javascript">
function prepareForm() {
var t = document.getElementById('top');
document.getElementById('search1').style.top = t.style.top + t.style.height;
document.getElementById('search2').style.top = t.style.top + t.style.height;
document.getElementById('search3').style.top = t.style.top + t.style.height;
}
function displayForm() {
var a = document.getElementsByName('search');
var b = document.getElementsByName('searchBy');
for (i=0;i<a.length;i++) {
if (!b[i].checked) {
a[i].style.display="none";
} else {
a[i].style.display="block";
}
}
}
</script>
</head>
<body style="font-family:calibri;text-align:center;" onLoad="displayForm();">
<div id="top">
<center><h3>My webpage</h3></center>
<br>
<form method="post" action="results.html" name='myForm'>
<center><font face='calibri'>Search By:</center><br>
<center>
<input type="radio" name="searchBy" value="search1" checked onClick="displayForm();">Form one
<input type="radio" name="searchBy" value="search2" onClick="displayForm();">Form two
<input type="radio" name="searchBy" value="search3" onClick="displayForm();">Form three
</div>
<!-- search area 1 -->
<div name="search" id="search1" style="margin-left:auto;margin-right:auto;display:block;">
<p>Form 1</p>
<input type="Submit" value="Submit">
</div>
<!-- search area 2-->
<div name="search" id="search2" style="margin-left:auto;margin-right:auto;display:none;">
<p>Form 2</p>
<input type="Submit" value="Submit"></b>
</div>
<!-- search area 3 -->
<div name="search" id="geoSearch" style="margin-left:auto;margin-right:auto;display:none;">
<p>Form 3</p>
</div>
</body>
</html>
This code appears to work in Chrome, but in IE9, the displayed doesn't change when the javascript function displayForm() is called. Is there something about a div's style.display attribute that's different between IE9 and Chrome?
If you truely need help, start by searching about why IE bugs with document.getElementByID
From : http://msdn.microsoft.com/en-us/library/ie/ms536437%28v=vs.85%29.aspx :
this method performs a case-insensitive match on both the ID and NAME
attributes, which might produce unexpected results.
After reading some about it, validating over a <!doctype>, try replacing your 'name' and 'id' so they match then test it and come back here with details and more infos so WE can try to help you further more.
PostScriptum : when i read this : "I didn't know that language attribute is obsolete from HTML 4" it felt like dang! Am i waisting my time trying to help someone who will never grow in a web UI development career, didn't do his homework with all his heart, and is most likely to become a 'copy-paster' coming on Stackoverflow to ask for 'do this because i can't'.
i have requirement to create form on the fly like html below
<form action='http://www.example.com' method='POST' name=''>
<input type='HIDDEN' name='' value=''>
<input type='HIDDEN' name='Username' value=''>
<input type='HIDDEN' name='password' value=''>
<input type='SUBMIT' value='Go'>
</form>
to the form once this form created it should automatically get post on page load in asp.net.
This is can not actually post on PageLoad. You can post it automatically only using javascript after you have render the html page.
This article have a source code on how to create this form dynamically on asp.net and automatically make the post. Is done exactly what you ask for.
http://www.codeproject.com/Articles/37539/Redirect-and-POST-in-ASP-NET
From the previous answer by #Aristos, I have checked the link and I have learnt too. You can check it out
You can also use javascript to post the form when the page load
...your forms tags here
<script type="text/javascript">
document.forms['form_name'].submit();
</script>
</body>
</html>
Just make sure the script is the last element in the DOM or use jQuery
$(document).ready(function()
{
document.forms['form_name'].submit();
}
);
I'm a beginner programmer to try to learn programming.
I just want to write code as simple as possible to add some data to SQL Server from html example below for purpose to learn the flow.
can anybody teach me the simple code by using asp.net?
<html>
<head>
<title> user register practice </title>
</head>
<body>
<h1>User Register</h1>
ID: <input type = "text"><br/>
Password: <input type = "password"><br/>
name: <input type = "text"><br/>
<input type ="submit">
<input type ="reset">
</body>
</html>
Your query has syntax errors, it should be INSERT INTO tablename (fields) VALUES (values). You're missing into.