Processing POST using Forms

Processing POST using Forms
This link shows how a Form is setup in HTML using both the GET and POST methods.
http://www.w3schools.com/tags/att_form_method.asp
The first line action refers to an ASP file on the server. The Posted data is processed by the ASP code.

form action="demo_form_method_post.asp" method="post">

For Espruino perhaps we can replace the ASP with a word that is used to steer the message to an appropriate handler.
One idea would be to use a Form to setup the column titles in a CSV file. It would create a CSV file on the SD card, taking the filename and column headers from the posted form. Ideas?
In previous forum posts we did the JSON POST from Java Script.
http://forum.espruino.com/conversations/285131/
Set up an HTML file called Postform2.html and copy it to the SD card

I tried to list it here but it doesn't work in the preview. So I attached it.

Part of the server code with console.log(“Header “,req.headers) added.

var pdata="";
function serveHTML(){
var http=require("http").createServer(onPageRequest).listen(8080);
}//end serveFile

function onPageRequest(req, res) { 
//console.log("Req= ",req);
console.log("Header",req.headers);
  var a = url.parse(req.url, true);
console.log("URL ",a);
if (req.method=="POST") {
  console.log("Post");
  doPost(req,res);
}else{
  doGet(req,res);
}//endif
}//end on PageRequest

The header and results of url.parse when Postform2.html is loaded and the Submit button is pressed.

Header {
  "Accept": "text/html, application/xhtml+xml, */*",
  "Referer": "http://192.168.1.3:8080/PostForm2.html",
  "Accept-Language": "en-US",
  "User-Agent": "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko",
  "Content-Type": "application/x-www-form-urlencoded",
  "Accept-Encoding": "gzip, deflate",
  "Host": "192.168.1.3:8080",
  "Content-Length": "19",
  "DNT": "1",
  "Connection": "Keep-Alive",
  "Cache-Control": "no-cache"
 }
URL  {
  "method": "GET",
  "host": "",
  "path": "/LOGdata",
  "pathname": "/LOGdata",
  "search": null, "port": null, "query": null }
Post
Length  19
pdata=  fname=xxx&lname=yyy
pdata length=  19

It’s strange to see GET in the URL results. Suggestions?
The pdata is the message received after the header.
It would be prudent to add code to limit the number of characters we can receive so that memory isn’t exhausted. The server code as of now crashes when the Submit button is pressed.

Repeating with the JPpost9.HTML using the JSON post from a script. The LED1 button was clicked.
The header and results of url.parse

Header {
  "Accept": "*/*",
  "Content-Type": "application/json;charset=utf8",
  "Referer": "http://192.168.1.3:8080/JPpostT9.html",
  "Accept-Language": "en-US",
  "Accept-Encoding": "gzip, deflate",
  "User-Agent": "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; rv:11.0) like Gecko",
  "Host": "192.168.1.3:8080",
  "Content-Length": "70",
  "DNT": "1",
  "Connection": "Keep-Alive",
  "Cache-Control": "no-cache"
 }
URL  {
  "method": "GET",
  "host": "",
  "path": "/CMD",
  "pathname": "/CMD",
  "search": null, "port": null, "query": null }
Post
Length  70
pdata=  {"name":"LED1","a":0,"cmd":"pobj.a=!pobj.a;digitalWrite(LED1,pobj.a)"}
pdata length=  70
{
  "name": "LED1",
  "a": 0,
  "cmd": "pobj.a=!pobj.a;digitalWrite(LED1,pobj.a)"
 }
Closed
>

So the code needs to use req.method to determine GET or POST.
If it’s a POST, then use
var a = url.parse(req.url, true);
and a.”path”, or a.”pathname” to determine if it’s a “CMD” or a “LOGdata” POST.
Anyone have a guess which is the right one?
If it’s not what’s coded in the server, the reply header should be 404?

One issue is that when the Submit button is pressed a new tab in the browser is opened.
This is resolved by changing the target attribute in the HTML file.
http://www.w3schools.com/tags/att_form_target.asp
form action="LOGdata" method="post" target="_blank">

More to follow.

1 Attachment

• serveHTMLpost10.js