Discussion :

[netlink1987]

Bonjour à tous,

Je m'arrache les cheveux (je n'en ai déjà plus beaucoup) avec une requête jquery vers une api qui
répond en json.

La particularité de cette requête est qu'elle envoie à la fois un fichier image au format BMP et des éléments JSON.

J'ai testé cette requête avec POSTMAN et ceci a fonctionné. En revanche, avec mon script cela ne fonctionne pas.

Voici le formulaire qui demande le fichier image:

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<form role="lm2sformuploadimage" id="lm2sformuploadimage" enctype="multipart/form-data">
        <label for="overlayimage"  class="h6"><span style="white-space:nowrap;color: #7e0219">Votre logo</span></label><BR>
        <input type="file" id="file" name="uploadimage" accept="image/bmp">
        <button type="submit" class="btn-xsbtn-success">envoyer</button>
        </form>

Voici le script qui envoie la requête:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
function submituploadimage(){
var fichier = $('input[name="uploadimage"]').get(0).files[0];
var formData = new FormData();
var json = [];
 
json.push(
                 {
                 "apiVersion":"1.0",
                 "context": "abc",
                 "method": "uploadOverlayImage",
                 "params":
                 {
                        "scaleToResolution": "false"
                 },
                }
                );
 
    //JSON obj
    formData.append('image', fichier);
    formData.append('json', JSON.stringify( json ));
        $.ajax({
            "url": "/axis-cgi/uploadoverlayimage.cgi",
            "method":"POST",
            "timeout": 0,
            "processData":false,
            "mimeType": "multipart/form-data",
            "contentType": false,
            "data": formData,
            "complete": function(data){
                            alert("success");
                    }
          });
}

A l’exécution, l'API me renvoie toujours la même erreur:

    apiVersion	"1.0"
    method	"unknown"
    error	Object { code: 1004, message: "invalid request" }
    code	1004
    message	"invalid request"

Hors je sais que les paramètres envoyés sont les bons, d'ailleurs cette requête quasi identique
envoyée par POSTMAN fonctionne:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var form = new FormData();
form.append("json", fileInput.files[0], "/D:/uploadoverlay/json.txt"); /* dans ce fichier se trouvent les mêmes paramètres que dans la requête précédente */
form.append("image", fileInput.files[0], "/D:/uploadoverlay/exemplebmp.bmp");
 
var settings = {
  "url": "http://192.168.1.38/axis-cgi/uploadoverlayimage.cgi",
  "method": "POST",
  "timeout": 0,
  "processData": false,
  "mimeType": "multipart/form-data",
  "contentType": false,
  "data": form
};
 
$.ajax(settings).done(function (response) {
  console.log(response);
});

J'ai comme l'impression que la requête json n'est pas comprise, tronquée ou mal interprétée.

J'ai tenté beaucoup de choses sans succès, avez vous une idée ?
D'avance merci.

[netlink1987]

salut,

J'ai finalement trouvé .... il fallait créer un objet de type BLOB ... la documentation de l'api n'en parle absolument pas .....

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
var formData = new FormData();
var uploadimage = $('input[name="uploadimage"]').get(0).files[0];
var jsonse = JSON.stringify({"apiVersion":"1.0","method":"uploadOverlayImage","context":"xxx","params":{"scaleToResolution":false}});
// voici le secret ... incroyable qu'un constructeur qui a pinion sur rue propose des docs aussi légères ...
var blob = new Blob([jsonse], {type: "application/json"});
formData.append('json', blob);
formData.append('image', uploadimage);

Donc, je clôture !