Jquery Ajax Request File Download operation failure reason analysis and solution _ajax related

jquery is really a nice lightweight JS framework that can help us quickly develop JS applications and, to some extent, change our habit of writing JavaScript code.

Cut the crap, go straight to the point, and we'll analyze the cause of the failure.

I. Causes of failure

That is because of the response reason, the general request browser is to handle the output of the server response, such as PNG, file download, etc., but the AJAX request is only a "character" request, that is, the content of the request is stored in text type. File download is in binary form, although can read to return to the response, but only read, is unable to execute, white dot is JS can not call to the browser's download processing mechanism and procedures.

Ii. Solutions

1 can use jquery to create the form and submit the implementation file download;

var form = $ ("<form>");
Form.attr ("Style", "Display:none");
Form.attr ("Target", "");
Form.attr ("Method", "post");
Form.attr ("Action", RootPath + "t_academic_essay/downloadzipfile.do");
var input1 = $ ("<input>");
Input1.attr ("type", "hidden");
Input1.attr ("name", "Strzippath");
Input1.attr ("value", Strzippath);
$ ("Body"). Append (form);
Form.append (INPUT1);
Form.submit ();
Form.remove ();

2 can directly use a tag to achieve file download;

<a href= "Download Address" > Click to download </a>

3 use hidden iframe or new form to resolve.

Use of Ps:ajax request $.ajax method

The $.ajax method using jquery allows you to control AJAX requests in more detail. It imposes fine-grained levels of control on AJAX requests.

$.ajax method Syntax

$.ajax (Options)
Parameters
Options	(object) An instance of an object whose properties define the parameters of this operation. Details are shown in the table below.
return value	XHR instance

Options Detail Range Value

Name	Type	Describe
Url	String	URL address of the request
Type	String	The HTTP method that will be used. Usually a post or a get. If omitted, the default is get
Data	Object	An object whose properties pass the request as a query parameter. If it is a GET request, the data is passed as a query string, and if it is a POST request, the data is passed as the request body. In both cases, the $.ajax () utility function handles the encoding of the value
DataType	String	A keyword that identifies the type of data that is expected to be returned in response to. This value determines what post-processing is performed before the data is passed to the callback function (if any). Valid values are as follows: The xml-response text is parsed into an XML document, and the resulting XML DOM is passed to the callback function The html-response text is passed to the callback function without processing. Any <script> block within the returned HTML fragment will be evaluated json-response text is evaluated as a JSON string, and the resulting object is passed to the callback function Jsonp-is similar to JSON in that it provides remote scripting support (assuming remote server support) The script-response text is passed to the callback function. Before any callback function is invoked, the response is processed as one or more JavaScript statements text-response text is assumed to be normal text. The server resource is responsible for setting the appropriate content type response headers. If this property is omitted, no processing or evaluation of the response text is passed to the callback function
Timeout	Numerical	Sets the timeout value (in milliseconds) for the AJAX request. If the request is not completed before the timeout value expires, the request is aborted and the error callback function is invoked (if defined)
Global	Boolean type	Enables or disables triggering of global functions. These functions can be attached to an element and triggered at different times or states of an Ajax call. Enable global function triggers by default
ContentType	String	The content type that will be specified on the request. Default is application/x-www-form-urlencoded (same as default type used for form submission)
Success	Function	If the requested response indicates a success status code, the function is invoked. The response body is returned to the function as the first parameter and is based on the specified datatype property. The second argument is a string that contains the status code-this is always a success status code
Error	Function	If the requested response returns an error status code, the function is invoked. Three arguments are passed to this function: The XHR instance, the status message string (in this case always the error status code), and the exception object returned by the XHR instance (optional)
Complete	Function	Called when the request completes. Two arguments are passed: xhr instance and Status message string (Success status code or error status code). If the success or error callback function is also specified, the function is called after the success or the error callback function call
Beforesend	Function	Called before the request is initiated. This function is passed the XHR instance, and can be used to set custom headers or perform other pre-request operations
Async	Boolean type	If specified as false, the request is submitted as a synchronization request. In the default case, the request is asynchronous
ProcessData	Boolean type	If set to False, the passed data is blocked from being processed into a URL-encoded format. By default, data is processed as a URL-encoded format (for requests of type application/x-www-form-urlencoded)
Ifmodified	Boolean type	If set to True, the request succeeds only if the response content has not changed (according to the last-modified header) since the last request. If omitted, no header check is performed

Here's an example of using as many options as you can.

Client code:

Service-side main code:

protected void Page_Load (object sender, EventArgs e)
{
if (! Page.IsPostBack)
{
if (request["id"]!= null &&!string. IsNullOrEmpty (request["id").　　　　　　ToString ())
{
//enable this sentence will cause an AJAX timeout exception
//System.Threading.Thread.Sleep (3000);
Response.Write (GetData (request["id").　　　　ToString ()));
}
}
protected string GetData (string id)
{
string str = string.　　Empty;
Switch (ID)
{case
"1":
str + = "This is number 1";
break;
Case "2":
str + + "This is number 2";
break;
Case "3":
str + + "This is number 3";
break;
Default:
str = "Warning other number!";
break;
return
str;
}

Run the program, as shown in the figure: