Maison >interface Web >js tutoriel >Analyse et solutions aux causes d'échec de l'opération de téléchargement de fichier de requête Jquery Ajax

Analyse et solutions aux causes d'échec de l'opération de téléchargement de fichier de requête Jquery Ajax

亚连original: 2018-05-24 14:55:292279parcourir

jQuery est en effet un très bon framework JS léger, qui peut nous aider à développer rapidement des applications JS, et dans une certaine mesure, il a changé notre habitude d'écrire du code JavaScript. Cet article se concentre sur l'introduction du téléchargement de fichiers de requête Jquery Ajax. et des solutions aux causes de l'échec des opérations. Les amis qui sont intéressés par l'analyse des causes de l'échec des requêtes ajax devraient apprendre ensemble

jQuery est en effet un très bon framework JS léger qui peut nous aider à développer rapidement une application JS, et dans une certaine mesure, cela a changé notre habitude d'écrire du code JavaScript.

Arrêtez de dire des bêtises et allons droit au but. Analysons d'abord les raisons de l'échec

1 Les raisons de l'échec

C'est à cause de la réponse. . Généralement, le navigateur demandeur traitera la réponse fournie par le serveur, comme la génération de png, le téléchargement de fichiers, etc. Cependant, la requête ajax n'est qu'une requête de « type caractère », c'est-à-dire que le contenu demandé est stocké sous forme de texte. . Le fichier est téléchargé sous forme binaire. Bien que la réponse renvoyée puisse être lue, elle est uniquement lue et ne peut pas être exécutée. Pour parler franchement, js ne peut pas appeler le mécanisme et le programme de traitement de téléchargement du navigateur.

2. Solution

1) Vous pouvez utiliser jquery pour créer un formulaire et le soumettre pour le téléchargement du fichier

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) Vous peut utiliser directement une balise pour implémenter le téléchargement de fichiers ;

45ccaae1ac1448cb8f2e3f6e73420ceaCliquez pour télécharger5db79b134e9f6b82c0b36e0489ee08ed

3) Utilisez une iframe cachée ou un nouveau formulaire pour résoudre .

PS : Utilisation de la méthode $.ajax de requête AJAX

Utilisez la méthode $.ajax de jQuery pour contrôler les requêtes AJAX plus en détail. Il exerce un niveau de contrôle précis sur les requêtes AJAX.

Syntaxe de la méthode $.ajax

$.ajax(options)

$.ajax(options)
参数
options	(对象)一个对象的实例，其属性定义这个操作的参数。详情见下表。
返回值	XHR实例

Paramètres

options

(object) Une instance d'un objet dont les propriétés définissent les paramètres de cette opération. Voir le tableau ci-dessous pour plus de détails.

Valeur de retour

Instance XHR

options valeur de plage détaillée

processDataifModified

下面看个例子，尽可能多的用到options中的选项

客户端代码：

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$().ready(function () {
　　$(&#39;#selectNum&#39;).change(function () {
　　　　var idValue = $(this).val();
　　　　var show = $(&#39;#show&#39;);
　　　　$.ajax({
　　　　　　url: &#39;Server.aspx&#39;,
　　　　　　type: &#39;POST&#39;,
　　　　　　data: { id: idValue },
　　　　　　//调小超时时间会引起异常
　　　　　　timeout: 3000,
　　　　　　//请求成功后触发
　　　　　　success: function (data) { show.append(&#39;success invoke!&#39; + data+&#39;<br/>&#39;); },
　　　　　　//请求失败遇到异常触发
　　　　　　error: function (xhr, errorInfo, ex) { show.append(&#39;error invoke!errorInfo:&#39; + errorInfo+&#39;<br/>&#39;); },
　　　　　　//完成请求后触发。即在success或error触发后触发
　　　　　　complete: function (xhr, status) { show.append(&#39;complete invoke! status:&#39; + status+&#39;<br/>&#39;); },
　　　　　　//发送请求前触发
　　　　　　beforeSend: function (xhr) {
　　　　　　//可以设置自定义标头
　　　　　　xhr.setRequestHeader(&#39;Content-Type&#39;, &#39;application/xml;charset=utf-8&#39;);
　　　　　　show.append(&#39;beforeSend invoke!&#39; +&#39;<br/>&#39;);
　　　　　　},
　　　　　　//是否使用异步发送
　　　　　　async: true
　　　　})
　　});
})
</script>
</head>
<body>
<select id="selectNum">
　　<option value="0">--Select--</option>
　　<option value="1">1</option>
　　<option value="2">2</option>
　　<option value="3">3</option>
</select>
<p id="show"></p>
</body>
</html>

服务端主要代码：

protected void Page_Load(object sender, EventArgs e)
{
　　if (!Page.IsPostBack)
　　{
　　　　if (Request["id"] != null && !string.IsNullOrEmpty(Request["id"].ToString()))
　　　　{
　　　　　　//启用该句会引发ajax超时异常
　　　　　　// 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;
}

运行程序，结果如图：

上面是我整理给大家的，希望今后会对大家有帮助。

jquery1.8版本使用ajax实现微信调用出现的问题分析及解决办法

基于h5的history改善ajax列表请求体验

简单谈谈AJAX核心对象

Nom	Type	Description
url	Chaîne	Adresse URL demandée
type	string	HTTP à utiliser. Généralement POST ou GET. En cas d'omission, la valeur par défaut est GET
data	object	Objet dont les propriétés sont transmises en tant que paramètres de requête à la requête. S'il s'agit d'une requête GET, les données sont transmises en tant que chaîne de requête ; s'il s'agit d'une requête POST, les données sont transmises en tant que corps de la requête. Dans les deux cas, l'encodage de la valeur est géré par la fonction utilitaire $.ajax()
dataType	String	Un mot clé pour identifier le attendu Le type de données qui seront renvoyées dans la réponse. Cette valeur détermine quel traitement ultérieur (le cas échéant) est effectué avant que les données ne soient transmises à la fonction de rappel. Les valeurs valides sont : xml - le texte de la réponse est analysé dans un document XML et le DOM XML résultant est transmis à la fonction de rappel html - le texte de la réponse est transmis au rappel fonction non traitée. Tous les blocs 3f1c4e4b6b16bbbd69b2ee476dc4f83a dans le fragment HTML renvoyé seront évalués json - le texte de la réponse est évalué comme une chaîne JSON et l'objet résultant est transmis à la fonction de rappel jsonp - Semblable à json, sauf qu'il fournit une prise en charge des scripts à distance (en supposant la prise en charge du serveur distant) script - Le texte de la réponse est transmis à la fonction de rappel. Avant qu'une fonction de rappel ne soit appelée, la réponse est traitée comme une ou plusieurs instructions JavaScript texte - Le texte de la réponse est supposé être du texte ordinaire. La ressource serveur est responsable de la définition de l’en-tête de réponse de type de contenu approprié. Si cet attribut est omis, le texte de la réponse est transmis à la fonction de rappel sans aucun traitement ni évaluation
timeout	Valeur	Définissez la valeur du délai d'expiration (millisecondes) de la requête Ajax. Si la requête ne se termine pas avant l'expiration du délai d'expiration, la requête est abandonnée et la fonction de rappel d'erreur (si définie) est appelée
global	Booléen	Activer ou désactiver le déclenchement des fonctions globales. Ces fonctions peuvent être attachées à des éléments et déclenchées à différents moments ou états lors des appels Ajax. Le déclenchement des fonctions globales est activé par défaut
contentType	String	Le type de contenu à préciser sur la requête. La valeur par défaut est application/x-www-form-urlencoded (identique au type par défaut utilisé pour la soumission du formulaire)
succès	Fonction	Cette fonction est appelée si la réponse à la requête indique un code d'état de réussite. Le corps de la réponse est renvoyé à cette fonction en tant que premier paramètre et est basé sur l'attribut dataType spécifié. Le deuxième paramètre est une chaîne contenant le code d'état - dans ce cas toujours le code d'état de réussite
erreur	Fonction	Cette fonction est appelée si la réponse à la requête renvoie un code d'état d'erreur. Trois arguments sont transmis à cette fonction : l'instance XHR, la chaîne du message d'état (toujours le code d'état d'erreur dans ce cas) et l'objet d'exception renvoyé par l'instance XHR (facultatif)
complete	La fonction	est appelée lorsque la requête est terminée. Deux arguments sont transmis : l'instance XHR et la chaîne du message d'état (code d'état de réussite ou code d'état d'erreur). Si la fonction de rappel de réussite ou d'erreur est également spécifiée, cette fonction est appelée après que la fonction de rappel de réussite ou d'erreur soit appelée
beforeSend	La fonction	est appelée avant de faire la requête. Cette fonction reçoit une instance XHR et peut être utilisée pour définir des en-têtes personnalisés ou effectuer d'autres opérations de pré-requête
async > Boolean	Si false est spécifié, la demande est soumise comme une demande synchrone. Par défaut, les requêtes sont asynchrones
Booléenne	S'il est défini sur false, il empêche le traitement des données transmises au format codé en URL. Par défaut, les données sont traitées au format codé URL (applicable aux requêtes de type application/x-www-form-urlencoded)
Booléen	Si défini sur true, uniquement si le contenu de la réponse n'a pas changé depuis la dernière requête (selon l'en-tête de l'indicateur Last-Modified) pour permettre à la demande d'aboutir. En cas d'omission, aucune vérification d'en-tête n'est effectuée

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：La version jquery1.8 utilise ajax pour implémenter l'analyse des problèmes et les solutions pour les appels WeChatArticle suivant：La version jquery1.8 utilise ajax pour implémenter l'analyse des problèmes et les solutions pour les appels WeChat

Articles Liés

Voir plus