web-dev-qa-db-fra.com

Faire un http POST Appel avec MultiPart / Form-Data à l'aide de jQuery?

J'essaie de faire un HTTP POST CALL AVEC MULTIPART/FORM-DATA, en utilisant jQuery:

$.ajax({
  url: 'http://localhost:8080/dcs/rest',
  type: 'POST',
  contentType:'multipart/form-data',
  data: 'dcs.source=boss-web&query=data&dcs.algorithm=lingo&dcs.output.format=JSON&dcs.clusters.only=true', 
  //dataType: "jsonP",
  success: function(jsonData) {alert('POST alert'); data=jsonData ; },
  error : function(XMLHttpRequest, textStatus, errorThrown) {
            console.log('An Ajax error was thrown.');
            console.log(XMLHttpRequest);
            console.log(textStatus);
            console.log(errorThrown);
          }
});

Ça ne marche pas. Firebug renvoie une erreur indéfinie et le champ Multipart d'objet renvoyé XMLHttpRequst est défini sur False.

Que puis-je faire pour faire ce travail avec jQuery? Et si ce n'est pas possible, existe-t-il un simple à y parvenir?

c'est-à-dire que je n'ai pas besoin de transférer des fichiers, juste quelques données. Mais le serveur nécessite un multiart.

javascriptjqueryhttppostmultipart
17
Alex Brooks

multipart/form-data ne regarde pas comme ça:

dcs.source=boss-web&query=data&dcs.algorithm=lingo&dcs.output.format=JSON&dcs.clusters.only=true

C'est application/x-www-form-urlencoded.

Voici un exemple de la façon dont multipart/form-data demande ressemble. Et le lien RFC 1867 .

multipart/form-data est assez souvent associé à la téléchargement de fichiers. Si tel est votre cas, vous pouvez jeter un coup d'œil sur le Plugin de formulaire de jQuery qui vous permet d'ajaxifier des formulaires et Supporte les téléchargements de fichiers .

11
Darin Dimitrov

Utilisation de formdata (), vous pouvez télécharger des fichiers via une demande Ajax.

Référez ce lien pour plus d'informations: formdata

Tutoriel sur l'utilisation de formdata : tutoriel

1
NkS

De cette façon fonctionne:

$( "form#upload-form" )
    .attr( "enctype", "multipart/form-data" )
    .attr( "encoding", "multipart/form-data" );
$.ajax({ 
    type: "POST",
    contentType:attr( "enctype", "multipart/form-data" ),
    url: "/adm/oferta_insert",
    data: dados, 
    success: function( data ) { 
        alert( data );  
    }  
});

http://www.bennadel.com/blog/1273-Setting-formingtype-dynamiquement-a-multipar-form-Data-in-i-internet-explorer-.htm

0
gilcierweb