Comment puis-je définir un champ personnalisé dans l'en-tête POST lors de la soumission d'un formulaire?
Comment puis-je définir un champ personnalisé dans l'en-tête POST lors de la soumission d'un formulaire?
Réponses:
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 serialize
qui transforme un FORMULAIRE HTML en form-url-encoded
valeurs prêtes pour le POST.
Ma suggestion est d'inclure soit
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.
À 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
.
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:true
garantit 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.
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
Si vous utilisez JQuery avec le plugin Form, vous pouvez utiliser:
$('#myForm').ajaxSubmit({
headers: {
"foo": "bar"
}
});
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.
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
XmlHttpRequest
vous dire? Ou juste un simple message HTML FORM?