Shulou(Shulou.com)06/02 Report--

This article shows you how to understand get and post in ajax. The content is concise and easy to understand, which will definitely brighten your eyes. I hope you can get something through the detailed introduction of this article.

one。 On the difference between Get and Post of Ajax

Get mode:

Simple data can be transmitted by get, but the size is generally limited to 1KB, and the data is appended to the url (http's header transfer), that is, the browser appends each form field element and its data to the resource path in the request line in the format of the URL parameter. In addition, the most important point is that it is cached by the client's browser so that others can read the customer's data, such as account number and password, from the browser's history. Therefore, in some cases, the get method can cause serious security problems.

Post mode:

When using POST mode, the browser sends each form field element and its data to the Web server as the entity content of the HTTP message, rather than as a parameter of the URL address. The amount of data transmitted by POST is much larger than that transmitted by GET.

In a word, GET mode has the advantages of small amount of data transmission, high processing efficiency and low security, and will be cached, while POST is vice versa.

When using get, you should pay attention to:

For get requests (or those involving url passing parameters), the passed parameters should be processed by the encodeURIComponent method first. Example: var url = "update.php?username=" + encodeURIComponent (username) + "& content=" + encodeURIComponent

(content) + "& id=1"

When using Post, you should note:

1. Set the Context-Type of header to application/x-www-form-urlencode to ensure that the server knows that there are parameter variables in the entity. The SetRequestHeader ("Context-Type", "application/x-www-form-urlencoded;") of the XmlHttpRequest object is usually used. Example:

XmlHttp.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded")

two。 Parameters are key-value pairs corresponding to name / value, and each pair of values is separated by an & sign. Such as var name=abc&sex=man&age=18, pay attention to var name=update.php?

Abc&sex=man&age=18 and var name=?abc&sex=man&age=18 are both written incorrectly.

3. Parameters are sent in the Send (parameter) method, for example: xmlHttp.send (name); if it is in get mode, direct xmlHttp.send (null)

4. Server-side request parameters distinguish between Get and Post. In get mode, $username = $_ GET ["username"]; if in post mode, $username = $_ POST ["username"]

The Post and Get methods differ as follows:

When 1.Post transmits data, it does not need to be displayed in URL, but the Get method is displayed in URL.

The amount of data transmitted by 2.Post is large, which can reach 2m, while the Get method can only transfer about 1024 bytes because of the limitation of URL length.

As the name implies, 3.Post is to transfer data to the server segment, and Get is to obtain data from the server segment. The reason why Get can also transmit data is only designed to tell the server what kind of data you need. Post information is used as the content of the http request, while Get is transmitted in the Http header.

Get method is received by Request.QueryString ["strName"]

Post method is received by Request.Form ["strName"]

Note:

Although the two submission methods can use Request ("strName") to obtain the submission data, it has an impact on the efficiency of the program and is not recommended.

In general, try to avoid using Get to submit forms, as it may lead to security problems

AJAX garbled problem

The cause of garbled code:

1. The default character encoding for the data returned by xtmlhttp is utf-8. If the client page is gb2312 or other encoded data, garbled codes will be generated.

2. The default character encoding of the data submitted by the post method is utf-8, which will generate garbled code if the server is gb2312 or other encoded data.

The solutions are:

1. If the client is gb2312 encoded, specify the output stream encoding on the server.

2. Both server and client use utf-8 encoding

Gb2312:header ('Content-Type:text/html;charset=GB2312')

Utf8:header ('Content-Type:text/html;charset=utf-8')

Note: if you have followed the above method or returned garbled code, check whether your method is get. For get requests (or anything involving url passing parameters), the passed parameters should be handled by the encodeURIComponent method first. If there is no encodeURIComponent processing, it will also produce garbled code.

The following is an example I found, because the writing is good, posted here, their own writing is relatively simple, it is not very standard or reference to other people's writing, hehe!

Post.html:

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849var http_request = false; function makePOSTRequest (url, parameters) {http_request = false; if (window.XMLHttpRequest) {/ / Mozilla, Safari,... Http_request = new XMLHttpRequest (); if (http_request.overrideMimeType) {/ / set type accordingly to anticipated content type / / http_request.overrideMimeType ('text/xml'); http_request.overrideMimeType (' text/html');}} else if (window.ActiveXObject) {/ / IE try {http_request = new ActiveXObject ("Msxml2.XMLHTTP") } catch (e) {try {http_request = new ActiveXObject ("Microsoft.XMLHTTP");} catch (e) {} if (! http_request) {alert ('Cannot create XMLHTTP instance'); return false;} http_request.onreadystatechange = alertContents Http_request.open ('POST', url, true); http_request.setRequestHeader ("Content-type", "application/x-www-form-urlencoded"); http_request.setRequestHeader ("Content-length", parameters.length); http_request.setRequestHeader ("Connection", "close"); http_request.send (parameters) } function alertContents () {if (http_request.readyState = = 4) {if (http_request.status = = 200) {/ / alert (http_request.responseText); result = http_request.responseText; document.getElementById ('myspan') [xss_clean] = result;} else {alert (' There was a problem with the request.') } function get (obj) {var poststr = "mytextarea1=" + encodeURI (document.getElementById ("mytextarea1") .value) + "& mytextarea2=" + encodeURI (document.getElementById ("mytextarea2") .value); makePOSTRequest ('post.php', poststr);}

Post.php

A large text box textarea contains a lot of data. Ajax requests service to return the result through URL. The URL contains various parameters, including the contents of the previous large text box. Prior to the development, I have been debugging with Firefox, and there is no problem for 4000-length strings to be requested through URL in textarea. There was a problem when it was submitted to the test. The tester found a problem under IE. When the character length in textarea exceeds 2000 (approximate data), an JS error will be reported, and ajax does not return a value to the foreground. Look at the original code: function getJsonData (url) {var ajax = Common.createXMLHttpRequest (); ajax.open ("GET", url,false); ajax.send (null); try {eval ("var s =" + ajax.responseText); return s;} catch (e) {return null;} function getData () {var url= "BlacklistService.do?datas=" + datasvalue; var result = getJsonData (url) } online google discovery solution: change the request for the XMLHttp used to POST, and separate the parameter from the URL and submit it. The modified code is as follows: function getJsonData (url,para) {var ajax = Common.createXMLHttpRequest (); ajax.open ("POST", url,false); ajax.setRequestHeader ('Content-Type','application/x-www-form-urlencoded'); ajax.send (para); try {eval ("var s =" + ajax.responseText); return s;} catch (e) {return null;}} function getData () {var url= "BlacklistService.do" Var para= "datas=" + datasvalue; var result = getJsonData (url,para);} = = the similarities and differences between get and post requests in Ajax Analysis of the similarities and differences between the two submission methods at 02:37 on Saturday, October 04, 2008 We often use get and post requests in Ajax. So when to request with get and when to request with post? Before making the answer, we first need to understand the difference between get and post. 1, get is to add the parameter data queue to the URL referred to by the ACTION attribute of the submitted form, the value corresponds to each field in the form one by one, which can be seen in URL. Through the HTTP post mechanism, post transmits each field in the form together with its contents in the HTML HEADER to the URL address referred to by the ACTION attribute. The process is not visible to the user. 2. For get mode, the server uses Request.QueryString to obtain the value of variables, and for post mode, the server uses Request.Form to obtain the submitted data. Parameters in both ways can be obtained using Request. 3. The amount of data transmitted by get is small and cannot be larger than 2KB. Post transmits a large amount of data and is generally regarded as unrestricted by default. But in theory, it varies with different servers. 4. Get security is very low, post security is high. 5. It is the same, that is to say, the parameter list at the back of the action page will be ignored when method is get; it is different. In addition, the Get request has the following features: it adds data to the URL and passes it to the server in this way, usually using a question mark? Represents the end of the URL address and the beginning of the data parameter, each of the following parameters appears in the form of "name = value", and the parameters are distinguished by a connector &. Post request has the following characteristics: data is placed in the HTTP body, and it is organized in more than one way, including-connection mode and separator mode, which can hide parameters and transfer a large number of data, which is more convenient. Through the above instructions, now we have a general idea of when to use get and when to use post, right! When we submit a form, we usually use post, and when we want to transfer a large data file, we need to use post. When the value passed only needs to be in parameter mode (this value is not greater than 2KB), use get mode. Now let's look at the difference between get and post when sending a request over URL. Using the following example, you can easily see the difference between sending the same data through GET and POST. The data sent is username= Zhang San: GET. The browser types http://localhost/?username= Zhang San GET /? username=%E5%BC%A0%E4%B8%89 HTTP/1.1 Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, application/vnd.ms-powerpoint, application/vnd.ms-excel, application/msword. * / * Accept-Language: zh-cn Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (compatible MSIE 6.0; Windows NT 5.0; .NET CLR 1.1.4322) Host: localhost Connection: Keep-AlivePOST method: POST / HTTP/1.1 Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, application/vnd.ms-powerpoint, application/vnd.ms-excel, application/msword, * / * Accept-Language: zh-cn Content-Type: application/x-www-form-urlencoded Accept-Encoding: gzip, deflate User-Agent: Mozilla/4.0 (compatible; MSIE 6.0) Windows NT 5.0; .NET CLR 1.1.4322) Host: localhost Content-Length: 28 Connection: Keep-Aliveusername=%E5%BC%A0%E4%B8%89 is distinguished by a form parameter and value attached to the URL request, and one in the message entity of the HTTP request. Comparing the above two paragraphs, we can see that GET puts the content of the form in the previous request header, while POST puts it in the body of the request, and POST sets the Content-Type header of the request to application/x-www-form-urlencoded. The text sent is the same. You can construct a form submission body like this: encodeURIComponent (arg1) = encodeURIComponent (value1) & encodeURIComponent (arg2) = encodeURIComponent (value2) &. Note: encodeURIComponent returns a new String object (in Unicode format) containing charstring content. All spaces, punctuation, accents, and other non-ASCII characters are replaced by% xx encoding, where xx equals the hexadecimal number representing the character. For example, the space returns "% 20". Characters with values greater than 255 are stored in% uxxxx format. See the encodeURIComponent () method of JavaScript. After understanding the above, we now use the XMLHttpRequest object of ajax to send some data to the server in GET and POST mode, respectively. GET mode var postContent = "name=" + encodeURIComponent ("xiaocheng") + "& email=" + encodeURIComponent ("xiaochengf_21@yahoo.com.cn"); xmlhttp.open ("GET", "somepage" + "?" + postContent, true); xmlhttp.send (null); POST mode var postContent = "name=" + encodeURIComponent ("xiaocheng") + "& email=" + encodeURIComponent ("xiaochengf_21@yahoo.com.cn"); xmlhttp.open ("POST", "somepage", true) Xmlhttp.setRequestHeader ("Content-Type", "application/x-www-form-urlencoded"); / / xmlhttp.setRequestHeader ("Content-Type", "text/xml"); / / if a xml file xmlhttp.send (postContent) is sent

Update from visitor "ar200r"-thank you very much

If we use "&" character it wont work...but if we use escape (); var poststr = "mytextarea1=" + escape (encodeURI (document.getElementById ("mytextarea1"). Value) + "& mytextarea2=" + escape (document.getElementById ("mytextarea2"). Value); and next in php u use urldecode, it will work good. The above content is how to understand get and post in ajax. Have you learned any knowledge or skills? If you want to learn more skills or enrich your knowledge reserve, you are welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.