X
Signin Job
Last week web jobs designed a local Web site with node. JS for user registration submissions, and a checksum check. A few days after the headache can be counted out. First of all, follow the teacher's advice to look at the API, the URL is:? https://nodejs.org/api/, looked after found himself confused, simply still do while thinking about it, first according to this URL (http://www.sitepoint.com/ creating-a-http-server-in-node-js/) on that classic write to the rotten sample create a server, then open the browser to browse localhost:8000 (because the job requires the use of port 8000; Because I did not involve very complicated things, just received the demand, the response to write the end of things. But the requirements of the job as shown above, so I would like to get those html,css or something, and then the server submission is not good, HTML and CSS is very quickly written. Then according to the FileSystem API to the browser this HTML and then found that cannot be rendered to the CSS, in order to this problem I thought for a morning, I first used Console.log to see the next response to the Req path, and then found that except/ There is a regist.css and then there is no then, I have started to stubborn like HTML and CSS to the browser, but I do not know how to write the header, see the online also did not understand ext kind of writing, later asked the group of people, discussion, finally want to understand is not sent together, but what the browser wants to give what, like the previous CSS is what the browser wants, I need the server JS there to determine the browser req needs, and then according to the requirements of the different write header, to the file. This question was thought for a morning.
? can give the browser Web page, the processing browser submitted, looked at a lot about how to deal with post submission data, and finally found the best use of JSON, I thought it would take a lot of time to learn J son, a look w3school found in fact not difficult, JSON is a data format, but it is very convenient for us to take data , so I have a variety of tests, see the online req.on (' data ', the function (data) {}) method can process the post data, and the data in the function is converted to a string, I use the console to see what the data is, To the string is what, the original data is a buffer (although I still do not understand what buffer is), to the string is the data of the post, is the &= situation of the data, happy, so with the QueryString module of the parse method to this data+ "" "string into JSON data, and then save the data when I started to create a new TXT file, I saved the JSON data, and then I changed it again, this is something. After I found the post data, I wanted to show how to animate the detail page, start with a new detail.js and then dynamically manipulate the detail.html but lying in bed at night, it's not better to just change HTML, so I fell asleep with a wonderful idea.
? Early next morning (Saturday) I began to realize my idea, Dynamic HTML, the process is still hard, and finally I wrote the HTML in a line to the file, and later saw someone else's code found that can be perfect indentation of the write, after each line plus \ is good. Anyway, finished, half of the project, the next is how to check the weight.
Check is the local live, go to heavy is the server's live, I directly in the HTML link a JS (in fact, there is the JQ library), in the JS checksum, mainly using regular expression to verify, here I spent half an afternoon to solve the problem of a pit dad, regular expression can not add space, it is taboo ( I wrote for a year Googlestyle you sue me for this) I know the truth of my tears fall down. In short, the logic is not a problem, verify that only the space is more disappointing, then go to the server-side to do, the same in Signin.js wrote, found the file after the JSON data found inside is not good processing, I directly take the string to deal with the instead of JSON file. Later, I stored the data directly in the query format data (that is, the &= format) and then the extracted file into JSON, so that each property of JSON (name number post Tele) is an array, and the same length. After traversal, look for duplicates and then return to the server side, and give me the results in memory of my dead last week?。????
Signin.js----
203;var http = require (' http ');
var fs = require (' FS ');
var qs = require (' querystring ');
var path = require (' path ');
var url = require (' URL ');
Http.createserver (function (req, res) {
var search = Url.parse (req.url). Search;
var pathname = Url.parse (req.url). Pathname;
if (pathname = = ' \ \ ' &&/\?username/.test (search)) {//if the query
Console.log (' yes ');//test
var query = Qs.parse (Url.parse (req.url). query);//Get Queries
Console.log (query.username);//test
Fs.readfile ('./output.txt ', ' utf-8 ', function (err, data) {//Read server file
if (err) throw err;
var jsontxt = qs.parse (data);
Console.log (jsontxt);//test
for (var i = 0; i < jsontxt.name.length; i++) {
if (jsontxt.name[i] = = Query.username) {//Match name
Console.log (Jsontxt.name[i]);
var detail_html =
‘
Details
User Details
User name: ' +jsontxt.name[i]+ '
Study number: ' +jsontxt.number[i]+ '
Phone: ' +jsontxt.tele[i]+ '
Email: ' +jsontxt.post[i]+ '
' Fs.open ('. \\detail\\detail.html ', ' W ', function (err, FD) {
if (err) throw err;
Fs.write (FD, detail_html, function (err) {
if (err) throw err;
});
Fs.readfile ('. \\detail\\detail.html ', function (err, data) {
if (err) throw err;
Res.end (data);
});
Fs.close (FD, function (err) {
if (err) throw err;
});
});
Break
} else if (i = = jsontxt.name.length-1) {///last no match 404
Res.writehead (404, {' Content-type ': ' text/html '});
Res.end (' 404notfound ');
}
};
})
} else if (pathname = = ' \ \ ' && Req.method = = ' GET ') {//root directory Registration
Res.writehead ($, {' Content-type ': ' text/html '})
Fs.readfile ('. \\regist\\regist.html ', function (err, data) {
if (err) {throw err;}
Res.write (data);
Res.end ();
})
} else if (pathname = = ' \/regist.css ') {
Res.writehead ($, {' Content-type ': ' Text/css '});
Fs.readfile ('. \\regist\\regist.css ', function (err, data) {
if (err) {throw err;}
Res.end (data);
})
} else if (pathname = = ' \/detail.css ') {
Res.writehead ($, {' Content-type ': ' Text/css '});
Fs.readfile ('. \\detail\\detail.css ', function (err, data) {
if (err) {throw err;}
Res.end (data);
})
} else if (pathname = = ' \/regist.js ') {
Res.writehead ($, {' Content-type ': ' Application/x-javascript '});
Fs.readfile ('. \\regist\\regist.js ', function (err, data) {
if (err) {throw err;}
Res.end (data);
})
} else if (pathname = = ' \/jquery.js ') {
Res.writehead ($, {' Content-type ': ' Application/x-javascript '});
Fs.readfile ('. \\jquery.js ', function (err, data) {
if (err) {throw err;}
Res.end (data);
})
}
if (Req.method = = ' POST ') {//post data deposit
var query = ';
var json;
Req.on (' Data ', function (data) {
Fs.open (' output.txt ', ' A + ', function (err, FD) {//Deposit data
if (err) {
throw err;
}
Query + = data;
var norepeat = true;
Console.log (query);//test
JSON = qs.parse (query);//JSON for queries
Fs.readfile ('./output.txt ', ' utf-8 ', function (err, data) {//de-weight
if (err) throw err;
var Localjson = qs.parse (data);
for (var i = 0; i < localjson.name.length; i++) {
if (localjson.name[i]==json.name) {
Norepeat = false;
Res.writehead ($, {' Content-type ': ' text/html '})
Fs.readfile ('. \\regist\\regist.html ', function (err, data) {
if (err) {throw err;}
Res.write (data);
Res.end ('
})
} else if (Localjson.number[i]==json.number) {
Norepeat = false;
Res.writehead ($, {' Content-type ': ' text/html '})
Fs.readfile ('. \\regist\\regist.html ', function (err, data) {
if (err) {throw err;}
Res.write (data);
Res.end ('
})
} else if (Localjson.tele[i]==json.tele) {
Norepeat = false;
Res.writehead ($, {' Content-type ': ' text/html '})
Fs.readfile ('. \\regist\\regist.html ', function (err, data) {
if (err) {throw err;}
Res.write (data);
Res.end ('
})
} else if (localjson.post[i]==json.post) {
Norepeat = false;
Res.writehead ($, {' Content-type ': ' text/html '})
Fs.readfile ('. \\regist\\regist.html ', function (err, data) {
if (err) {throw err;}
Res.write (data);
Res.end ('
})
}
};
if (norepeat) {//server is not duplicated
Write to local file
Fs.write (FD, ' & ' +query, function (err) {
if (err) throw err;
});
Fs.close (FD, function (err) {
if (err) throw err;
});
Add HTML dynamically
var detail_html =
‘
Details
User Details
User name: ' +json.name+ '
Study number: ' +json.number+ '
Phone: ' +json.tele+ '
Email: ' +json.post+ '
' Fs.open ('. \\detail\\detail.html ', ' W ', function (err, FD) {
if (err) throw err;
Fs.write (FD, detail_html, function (err) {
if (err) throw err;
});
Fs.readfile ('. \\detail\\detail.html ', function (err, data) {
if (err) throw err;
Res.end (data);
});
Fs.close (FD, function (err) {
if (err) throw err;
});
});
}
});
});
});
}
}). Listen (8000);
Console.log (' Server running at http://127.0.0.1:8000 ');
--------------------------I am the wayward dividing line----------------------------------------------
?? regist.html-----
?
Registered
User Registration
User name
School Number
Phone
Mailbox
-------------------------------I've come to ZHUANGB again------------------------------
? REGIST.CSS-----
#head {
Text-align:center;
}
form {
Border:black 1px solid;
}
#subhead {
Text-align:center;
}
. Content {
Text-align:center;
margin:10px;
}
#func {
Text-align:right;
}
#func Input {
margin:10px;
}
---------------------------------Yes, or am I---------------------------------
Regist.js-----
?
? $ (function () {
$ ('. Content input '). blur (function () {
if ($ (this). attr (' name ') = = ' Name ' &&! ( /^[a-za-z]{1}\w{5,17}$/.test ($ (this). Val ()))) {
$ (' #name '). Text (' name is 6-18 letters, the first was not a number ');
if (/^[0-9]\w{5, 17}$/.test (This). Val ())) $ (' #name '). Text (' The first was not a number ');
if (/^[a-za-z]\w{0, 4}]$/.test ($ (this). val ()) | | /^[a-za-z]\w{18,}$/.test ($ (this). Val ())) $ (' #name '). Text (' Total 6-18 letters or numbers ');
}
else if ($ (this). attr (' name ') = = ' Name ' && (/^[a-za-z]{1}\w{5,17}$/.test ($ (this). Val ())))
$ (' #name '). Text (' YES ^_^ ');
if ($ (this). attr (' name ') = = ' Number ' &&! ( /^[1-9][0-9]{7}$/.test ($ (this). Val ())))
$ (' #number '). Text (' It Shoulde is 8 numbers and no letter ');
else if ($ (this). attr (' name ') = = ' Number ' && (/^[1-9][0-9]{7}$/.test ($ (this). Val ())))
$ (' #number '). Text (' YES ^_^ ');
if ($ (this). attr (' name ') = = ' Tele ' &&! ( /^[1-9][0-9]{10}$/.test ($ (this). Val ())))
$ (' #tele '). Text (' It Shoulde be one numbers and no letter ');
else if ($ (this). attr (' name ') = = ' Tele ' && (/^[1-9][0-9]{10}$/.test ($ (this). Val ())))
$ (' #tele '). Text (' YES ^_^ ');
if ($ (this). attr (' name ') = = ' Post ' &&! ( /^[a-za-z0-9_\-][email protected] ([[a-za-z_\-]) +\.) +[a-za-z]{2,4}$/.test ($ (this). Val ()))) {
$ (' #post '). Text (' No kidding ^_^ ');
}
else if ($ (this). attr (' name ') = = ' Post ' && (/^[a-za-z_\-][email protected] (([a-za-z_\-]) +\.) +[a-za-z]{2,4}$/.test ($ (this). Val ())))
$ (' #post '). Text (' YES ^_^ ');
});
$ (' #submit '). Click (function () {
$ ('. Content input '). each (function () {
if ($ (this). attr (' name ') = = ' Name ' &&! ( /^[a-za-z]\w{5,17}$/.test ($ (this). Val ()))) {
$ (' #name '). Text (' No kidding ^_^ ');
$ (' #submit '). attr (' disabled ', true);
}
else if ($ (this). attr (' name ') = = ' Name ' && (/^[a-za-z]\w{5,17}$/.test (This). Val ()))) {
$ (' #name '). Text (' YES ^_^ ');
$ (' #submit '). attr (' disabled ', false);
}
if ($ (this). attr (' name ') = = ' Number ' &&! ( /[1-9] ([0-9]) {7}/.test ($ (this). Val ()))) {
$ (' #number '). Text (' No kidding ^_^ ');
$ (' #submit '). attr (' disabled ', true);
}
else if ($ (this). attr (' name ') = = ' Number ' && (/[1-9] ([0-9]) {7}/.test (this). Val ()))) {
$ (' #number '). Text (' YES ^_^ ');
$ (' #submit '). attr (' disabled ', false);
}
if ($ (this). attr (' name ') = = ' Tele ' &&! ( /[1-9][0-9]{10}/.test ($ (this). Val ()))) {
$ (' #tele '). Text (' No kidding ^_^ ');
$ (' #submit '). attr (' disabled ', true);
}
else if ($ (this). attr (' name ') = = ' Tele ' && (/[1-9][0-9]{10}/.test ($ (this). Val ()))) {
$ (' #tele '). Text (' YES ^_^ ');
$ (' #submit '). attr (' disabled ', false);
}
if ($ (this). attr (' name ') = = ' Post ' &&! ( /^[a-za-z_\-][email protected] ([[a-za-z_\-]) +\.) +[a-za-z]{2,4}$/.test ($ (this). Val ()))) {
$ (' #post '). Text (' No kidding ^_^ ');
$ (' #submit '). attr (' disabled ', true);
}
else if ($ (this). attr (' name ') = = ' Post ' && (/^[a-za-z_\-][email protected] (([a-za-z_\-]) +\.) +[a-za-z]{2,4}$/.test ($ (this). Val ()))) {
$ (' #post '). Text (' YES ^_^ ');
$ (' #submit '). attr (' disabled ', false);
}
})
})
$ (' #reset '). Click (function () {
$ ('. Content input '). Val (');
$ ('. Content span '). Text (');
})
})
---------------------------------bite me,---------------------------------
About DETAIL.CSS and detail.html because of simple omitted (Bo master rush to hand in homework, CSS no intentions, sorry. )
node. js in web2.0 class