Comment définir un champ d'en-tête sur POST un formulaire?

Réponses:

60

Cela ne peut pas être fait - AFAIK.

Cependant, vous pouvez utiliser par exemple jquery (bien que vous puissiez le faire avec du javascript brut) pour sérialiser le formulaire et l'envoyer (en utilisant AJAX) tout en ajoutant votre en-tête personnalisé.

Regardez la jquery serializequi transforme un FORMULAIRE HTML en form-url-encodedvaleurs prêtes pour le POST.

METTRE À JOUR

Ma suggestion est d'inclure soit

  • un élément de formulaire caché
  • un paramètre de chaîne de requête
Aliostad
la source
2
Je ne peux pas utiliser ajax dans ce cas. D'une manière ou d'une autre, je poste et redirige vers une page aspx. La redirection est effectuée par From Post.
Reza Owliaei
2
Ma suggestion est d'inclure 1) un élément de formulaire caché 2) un paramètre de chaîne de requête
Aliostad
1
Pouvez-vous sérialiser des fichiers? Je pensais: Non
Fallenreaper
Oui, vous pouvez sérialiser des fichiers en chaînes Base64, peut-être très maladroit pour les fichiers volumineux puisque Base64 peut être assez volumineux. Mais il en va de même pour chaque méthode de sérialisation.
Felype
Je l'ajouterais juste en tant que paramètre de chaîne de requête et demanderais à votre serveur de vérifier si un en-tête ou une chaîne de requête existe et possède le jeton.
James111
14

Définissez une valeur de cookie sur la page, puis lisez-la côté serveur.

Vous ne pourrez pas définir d'en-tête spécifique, mais la valeur sera accessible dans la section des en-têtes et non dans le corps du contenu.

Chris Hynes
la source
3
Remarque: Si l'en-tête que vous souhaitez ajouter est destiné à la protection CSRF, assurez-vous de ne pas stocker ce jeton dans un cookie, sinon vous allez annuler la protection CSRF.
Jimothy
5

À partir de la documentation FormData :

XMLHttpRequest Level 2 ajoute la prise en charge de la nouvelle interface FormData. Les objets FormData permettent de créer facilement un ensemble de paires clé / valeur représentant les champs de formulaire et leurs valeurs, qui peuvent ensuite être facilement envoyés à l'aide de la XMLHttpRequest send()méthode.

Avec un XMLHttpRequest vous pouvez définir les en-têtes personnalisés, puis effectuer le POST.

Majid
la source
2

En fait, une meilleure façon de le faire est d'enregistrer un cookie côté client. Ensuite, le cookie est automatiquement envoyé avec chaque en-tête de page pour ce domaine particulier.

Dans node-js, vous pouvez configurer et utiliser des cookies avec cookie-parser .

un exemple:

res.cookie('token', "xyz....", { httpOnly: true });

Vous pouvez maintenant accéder à ceci: 

app.get('/',function(req, res){
 var token = req.cookies.token
});

Notez que cela httpOnly:truegarantit que le cookie n'est généralement pas accessible manuellement ou via javascript et que seul le navigateur peut y accéder. Si vous souhaitez envoyer des en-têtes ou des jetons de sécurité avec un message de formulaire, et non via ajax, dans la plupart des cas, cela peut être considéré comme un moyen sécurisé. Assurez-vous cependant que les données sont envoyées via un protocole sécurisé / ssl si vous stockez des informations sensibles liées à l'utilisateur, ce qui est généralement le cas.

Ramesh Pareek
la source
1

Voici ce que j'ai fait dans pub / jade

extends layout
block content
    script(src="/jquery/dist/jquery.js")
    script.
      function doThePost() {
        var jqXHR = $.ajax({ 
            type:'post'
            , url:<blabla>
            , headers: { 
                'x-custom1': 'blabla'
                , 'x-custom2': 'blabla'
                , 'content-type': 'application/json'
            }
            , data: {
                'id': 123456, blabla
            }
        })
        .done(function(data, status, req) { console.log("done", data, status, req); })
        .fail(function(req, status, err) { console.log("fail", req, status, err); });
      }
    h1= title
    button(onclick='doThePost()') Click
Steve
la source
0

Vous pouvez utiliser $ .ajax pour éviter le comportement naturel de <form method="POST">. Vous pouvez, par exemple, ajouter un événement au bouton de soumission et traiter la requête POST comme AJAX.

Fabio Buda
la source
2
J'utilise ce formulaire pour me rediriger vers une page aspx et publier des données.
Reza Owliaei
faites-moi mieux comprendre: 1) les messages des utilisateurs 2) l'enregistrement des données 3) la redirection. C'est ce que tu fais?
Fabio Buda
J'ai un iFrame dans une page Html (Source), pointant vers une autre page html (Proxy). La page proxy publie un paramètre (No Get) via un élément de formulaire. La redirection et la publication se produisent lors de la soumission du formulaire. Je récupère les paramètres publiés dans la page aspx comme destination.
Reza Owliaei
0

Pour ajouter à chaque demande ajax, j'y ai répondu ici: https://stackoverflow.com/a/58964440/1909708

Pour ajouter des requêtes ajax particulières, voici comment j'ai implémenté:

var token_value = $("meta[name='_csrf']").attr("content");
var token_header = $("meta[name='_csrf_header']").attr("content");
$.ajax("some-endpoint.do", {
 method: "POST",
 beforeSend: function(xhr) {
  xhr.setRequestHeader(token_header, token_value);
 },
 data: {form_field: $("#form_field").val()},
 success: doSomethingFunction,
 dataType: "json"
});

Vous devez ajouter les metaéléments dans le JSP, par exemple

<html>
<head>        
    <!-- default header name is X-CSRF-TOKEN -->
    <meta name="_csrf_header" content="${_csrf.headerName}"/>
    <meta name="_csrf" content="${_csrf.token}"/>

Pour ajouter à une demande de soumission de formulaire (synchrone), j'y ai répondu ici: https://stackoverflow.com/a/58965526/1909708

Pantalon Himadri
la source