Foreground processing Check trilogy before the "JavaScript" form is submitted

Originally a small form of parameter transfer is very simple, is the basis of the foundation, but considering the online criminals are more and more rampant, and those who do not usually have to do a bit of hacking hack technology more and more people, you in the form before the first should be processed in the foreground, Background part of course also to deal with the problem of SQL injection, but this article mainly discusses the foreground form parameter transfer problem. Really do not know those who are bent on the black people site, think their technology is very good appearance, in fact, there is such a strong technology, you should find a job to get high salary, rather than focus on hackers 10,000 years, embarrassed some small website program ape. Program Ape why bother to program ape? The same ape.

I. BASIC OBJECTIVES

First, there is no escape character, causing the webpage to crash, if not processed, the result of the following commit is a Submit button appears ...

This part of "JavaScript" some characters do not escape can cause the Web page crash and the display method involving the escape character (click the Open link) has been discussed, here just to come together.

Then, the question of Word count check, whether the input content is empty, the problem needs to be detected. Word-count instant check How to do it, in the "JavaScript" multi-input box input word-count instant check (click Open link) has been discussed, the core technology can see "javascript" imitation Sina Weibo eco-compatible IE6 of the input words of the Instant check (click to open the link). Of course, there is another need to judge the form before it is submitted. Otherwise, if you have these things to connect to the database, it is likely to cause data insertion exceptions in the database.

Second, the basic idea

Anyway, a form submission, before submission, in addition to the front desk to do the necessary checks "JavaScript" form of instant verification, unsuccessful submission "(Click to open the link), but also the final trilogy:

1, the input box is empty

2. Whether the input box input is more than the number of words

3, the input box character is escaped, and then into the library, or

As for how to complete the parameter transfer between forms, this is not the focus of this article. Specific can be seen:

ASP is a VBScript version of the "ASP" Connection Access database login system (click to open the link)

ASPX is the habit of aps.net when it's time to write an editorial record, forgetting to remember.

For the JSP version, see "Filter" to solve the coding problem of post transmission with filter filters and to simplify parameter passing by using El expression (click to open link)

PHP, please see "PHP" basic syntax and the number of pages between the transfer "(click to open the link)

I have written, are some very basic things!

Third, the production process

1. HTML part

The page layout is exactly the same as the input word count for "JavaScript" multi-input box (click the Open link), but adds the OnSubmit property to the form submission, and if the return is false the form cannot be submitted, and return true can be submitted , default return True if not written, and must be judged before it is required to be committed.

<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "Http://www.w3.org/TR/html4/loose.dtd" >

2. Core script JavaScript Section
In addition to the intrinsic function in the "JavaScript" multi-input box input word-count instant check (click the Open link) and "javascript" some characters do not escape can cause the Web page to crash and the display method involving escape characters (click Open link) That is, adding a onsubmit function:
<script>//start of escape function var keys = Object.keys | | function (obj) {obj = Object (obj) var arr = [] for (var a in obj) Arr.push (a) return arr}var invert = funct  Ion (obj) {obj = Object (obj) var result = {} for (Var a in obj) result[obj[a]] = a return Result}var entitymap      = {escape: {' & ': ' & ', ' < ': ' < ', ' > ': ' > ', ' ': ' "', ' ': '   ',       /* If your later Web program also involves filenames, file operations, such as import and export functions, you'd better add the following rules in this mapping table, turn the half-width to the corner, otherwise it may be wrong ' \ \ ': ' \ ', '/': '/', ': ': ', '*' : '＊', '?' : '？ ', ' | ': ' | ', */}}entitymap.unescape = invert (entitymap.escape); var entityreg={escape:regexp (' [' + keys  (Entitymap.escape). Join (') + '] ', ' g '), Unescape:regexp (' (' + Keys ' (entitymap.unescape). Join (' | ') + ') ', ' G ')}function        Htmlescape (HTML) {if (typeof html! = ' string ') return ' return ' html.replace (Entityreg.escape, function (match) { Return Entitymap.escape[match]})}function Htmlunescape (StR) {if (typeof str! = ' string ') return ' return str.replace (Entityreg.unescape, function (match) {return en Titymap.unescape[match]})}//the end of the escape function//Get length function getstrlength (str) {var mylen=0;for (var i=0;i<str.length;i++ {if (Str.charcodeat (i) >0&&str.charcodeat (i) <128) {mylen++;} else{mylen+=2;}} return Mylen;} The input triggers this function inputtest (id,value) {if (id== "title") {document.getElementById ("wordlength" +id) when the number of characters changes. Innerhtml=parseint (Getstrlength (Htmlescape (value))/2) + "\/10";} Else{document.getelementbyid ("Wordlength" +id). Innerhtml=parseint (Getstrlength (Htmlescape (value))/2) + "\/50";} if (id== "title") {if (parseint (Getstrlength (Htmlescape (value))) >20) {document.getElementById ("test" +id). style.display= "Block";d Ocument.getelementbyid ("Test" +id). Innerhtml= "Too long, please modify to 10 words";d Ocument.getelementbyid ("  Test "+id"). style.color= "#ff0000";} Else{document.getelementbyid ("Test" +id). Innerhtml= "";d Ocument.getelementbyid ("Test" +id). style.display= "None";}} Else{if (parseint (GetstrlenGth (Htmlescape (value))) >100) {document.getElementById ("test" +id). style.display= "Block"; document.getElementById ("Test" +id). Innerhtml= "Too long, please modify to 50 words";d Ocument.getelementbyid ("Test" +id). style.color= "#  Ff0000 ";} Else{document.getelementbyid ("Test" +id). Innerhtml= "";d Ocument.getelementbyid ("Test" +id). style.display= "None";}} Validation before form submission, with character escaping function check () {//First get title, content, and then immediately escape var Title=document.getelementbyid ("title"). Value;var Content=document.getelementbyid ("Content"). Value;title=htmlescape (title) + ""; content=htmlescape (content) + "";// Check its length by various methods to reduce the likelihood of bypassing judgment if (title.length==0| | title== "" | | parseint (Getstrlength (title)) ==0) {alert ("title cannot be Empty"); return false;} if (content.length==0| | content== "" | | parseint (getstrlength (content)) ==0) {alert ("Content cannot be empty"); return false;} Because this is to count whether the number of characters is more than 10 characters, 20 characters, so only can use their own getstrlength//length, Chinese characters, English are counted as a character if (parseint (Getstrlength (title)) >20) {alert ("cannot have more than 10 characters"); return false;} if (parseint (content)) >100) {alert ("content cannot be more than 50 kanji"); return false;} Overwrite the escaped content with the form originallyThe value is resubmitted, so that the HTML will not cause the Web page to crash these issues.    document.getElementById ("title"). Value=title;document.getelementbyid ("Content"). Value=content;    return true; } </script>

The above is the front desk to verify the entire process of the form, of course, the background is also to prevent SQL injection, if the Internet does not have that group of ulterior motives of hackers, there is no need to write such a long code!
Foreground processing Check trilogy before the "JavaScript" form is submitted