Comment lire les paramètres de demande de publication à l'aide de JavaScript

J'essaye de lire les paramètres de demande de publication de mon HTML. Je peux lire les paramètres de demande d'obtention en utilisant le code suivant en JavaScript.

$wnd.location.search

Mais cela ne fonctionne pas pour la demande de publication. Quelqu'un peut-il me dire comment lire les valeurs des paramètres de demande de publication dans mon HTML à l'aide de JavaScript?

Les données POST sont des données gérées côté serveur . Et Javascript est du côté client. Il n'y a donc aucun moyen de lire les données d'une publication en utilisant JavaScript.

Un petit morceau de PHP pour que le serveur remplisse une variable JavaScript est simple et rapide:

var my_javascript_variable = <?php echo json_encode($_POST['my_post'] ?? null) ?>;

Ensuite, accédez simplement à la variable JavaScript de la manière habituelle.

Notez qu'il n'y a aucune garantie que des données ou types de données donnés seront affichés à moins que vous ne vérifiiez - tous les champs de saisie sont des suggestions, pas des garanties.

JavaScript est un langage de script côté client, ce qui signifie que tout le code est exécuté sur la machine de l'utilisateur Web. Les variables POST, par contre, vont au serveur et y résident. Les navigateurs ne fournissent pas ces variables à l'environnement JavaScript, et aucun développeur ne devrait s'attendre à ce qu'elles soient là comme par magie.

Étant donné que le navigateur interdit à JavaScript d'accéder aux données POST, il est pratiquement impossible de lire les variables POST sans qu'un acteur extérieur comme PHP ne fasse écho aux valeurs POST dans une variable de script ou une extension / addon qui capture les valeurs POST en transit. Les variables GET sont disponibles via une solution de contournement car elles sont dans l'URL qui peut être analysée par l'ordinateur client.

Utilisez sessionStorage!

$(function(){
    $('form').submit{
       document.sessionStorage["form-data"] =  $('this').serialize();
       document.location.href = 'another-page.html';
    }
});

Sur une autre page.html:

var formData = document.sessionStorage["form-data"];

Lien de référence - https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

Pourquoi ne pas utiliser localStorage ou tout autre moyen pour définir la valeur que vous souhaitez transmettre?

De cette façon, vous y avez accès de n'importe où!

Par n'importe où, je veux dire dans le domaine / contexte donné

Vous pouvez lire le paramètre de demande de publication avec jQuery-PostCapture ( @ ssut / jQuery-PostCapture ).

Le plugin PostCapture est composé de quelques astuces.

Lorsque vous cliquez sur le bouton Soumettre, l' onsubmitévénement sera distribué.

À ce moment-là, PostCapture sérialisera les données du formulaire et les sauvegardera dans html5 localStorage (si disponible) ou dans le stockage des cookies.

POST est ce que le navigateur envoie du client (votre broswer) au serveur Web. Les données de publication sont envoyées au serveur via les en-têtes http, et elles sont disponibles uniquement à l'extrémité du serveur ou entre le chemin (exemple: un serveur proxy) du client (votre navigateur) au serveur Web. Il ne peut donc pas être géré à partir de scripts côté client comme JavaScript. Vous devez le gérer via des scripts côté serveur comme CGI, PHP, Java, etc. Si vous avez encore besoin d'écrire en JavaScript, vous devez avoir un serveur Web qui comprend et exécute JavaScript sur votre serveur comme Node.js

Si vous travaillez avec une API Java / REST, une solution de contournement est simple. Dans la page JSP, vous pouvez effectuer les opérations suivantes:

    <%
    String action = request.getParameter("action");
    String postData = request.getParameter("dataInput");
    %>
    <script>
        var doAction = "<% out.print(action); %>";
        var postData = "<% out.print(postData); %>";
        window.alert(doAction + " " + postData);
    </script>

<script>
<?php
if($_POST) { // Check to make sure params have been sent via POST
  foreach($_POST as $field => $value) { // Go through each POST param and output as JavaScript variable
    $val = json_encode($value); // Escape value
    $vars .= "var $field = $val;\n";
  }
  echo "<script>\n$vars</script>\n";
}
?>
</script>

Ou utilisez-le pour les mettre dans un dictionnaire qu'une fonction pourrait récupérer:

<script>
<?php
if($_POST) {
  $vars = array();
  foreach($_POST as $field => $value) {
    array_push($vars,"$field:".json_encode($value)); // Push to $vars array so we can just implode() it, escape value
  }
  echo "<script>var post = {".implode(", ",$vars)."}</script>\n"; // Implode array, javascript will interpret as dictionary
}
?>
</script>

Puis en JavaScript:

var myText = post['text'];

// Or use a function instead if you want to do stuff to it first
function Post(variable) {
  // do stuff to variable before returning...
  var thisVar = post[variable];
  return thisVar;
}

Ceci n'est qu'un exemple et ne doit pas être utilisé pour des données sensibles comme un mot de passe, etc. La méthode POST existe pour une raison; pour envoyer des données en toute sécurité au backend, ce qui irait à l'encontre de l'objectif.

Mais si vous avez juste besoin d'un tas de données de formulaire non sensibles pour accéder à votre page suivante sans /page?blah=value&bleh=value&blahbleh=valuevotre URL, cela créerait une URL plus propre et votre JavaScript pourrait interagir immédiatement avec vos données POST.

J'ai un code simple pour le faire:

Dans votre index.php:

<input id="first_post_data" type="hidden" value="<?= $_POST['first_param']; ?>"/>

Dans votre main.js:

let my_first_post_param = $("#first_post_data").val();

Ainsi, lorsque vous incluez main.js dans index.php ( <script type="text/javascript" src="./main.js"></script>), vous pouvez obtenir la valeur de votre entrée masquée qui contient vos données de publication.

Vous pouvez «json_encode» pour encoder d'abord vos variables de publication via PHP. Créez ensuite un objet JS (tableau) à partir des variables de publication codées JSON. Ensuite, utilisez une boucle JavaScript pour manipuler ces variables ... Comme - dans cet exemple ci-dessous - pour remplir un formulaire HTML:

<script>

    <?php $post_vars_json_encode =  json_encode($this->input->post()); ?>

    // SET POST VALUES OBJECT/ARRAY
    var post_value_Arr = <?php echo $post_vars_json_encode; ?>;// creates a JS object with your post variables
    console.log(post_value_Arr);

    // POPULATE FIELDS BASED ON POST VALUES
    for(var key in post_value_Arr){// Loop post variables array

        if(document.getElementById(key)){// Field Exists
            console.log("found post_value_Arr key form field = "+key);
            document.getElementById(key).value = post_value_Arr[key];
        }
    }


</script>

Une option consiste à définir un cookie en PHP.

Par exemple: un cookie nommé invalide avec la valeur $invalidexpirant dans 1 jour:

setcookie('invalid', $invalid, time() + 60 * 60 * 24);

Ensuite, relisez-le dans JS (en utilisant le plugin JS Cookie ):

var invalid = Cookies.get('invalid');

if(invalid !== undefined) {
    Cookies.remove('invalid');
}

Vous pouvez maintenant accéder à la valeur de la invalidvariable en JavaScript.

Cela dépend de ce que vous définissez comme JavaScript. Aujourd'hui, nous avons JS dans des programmes côté serveur tels que NodeJS. C'est exactement le même JavaScript que vous codez dans votre navigateur, sauf en tant que langage serveur. Vous pouvez donc faire quelque chose comme ceci: ( Code de Casey Chu: https://stackoverflow.com/a/4310087/5698805 )

var qs = require('querystring');

function (request, response) {
    if (request.method == 'POST') {
        var body = '';

        request.on('data', function (data) {
            body += data;

            // Too much POST data, kill the connection!
            // 1e6 === 1 * Math.pow(10, 6) === 1 * 1000000 ~~~ 1MB
            if (body.length > 1e6)
                request.connection.destroy();
        });

        request.on('end', function () {
            var post = qs.parse(body);
            // use post['blah'], etc.
        });
    }
}

Et de là utiliser post['key'] = newVal;etc ...

Les variables POST ne sont disponibles pour le navigateur que si ce même navigateur les a envoyées en premier lieu. Si un autre formulaire de site Web est soumis via POST à ​​une autre URL, le navigateur ne verra pas les données POST entrer.

SITE A: a un formulaire soumis à une URL externe (site B) en utilisant POST SITE B: recevra le visiteur mais avec uniquement des variables GET

function getParameterByName(name, url) {
            if (!url) url = window.location.href;
            name = name.replace(/[\[\]]/g, "\\$&");
            var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
                results = regex.exec(url);
            if (!results) return null;
            if (!results[2]) return '';
            return decodeURIComponent(results[2].replace(/\+/g, " "));
        }
var formObj = document.getElementById("pageID");
formObj.response_order_id.value = getParameterByName("name");

$(function(){
    $('form').sumbit{
        $('this').serialize();
    }
});

Dans jQuery, le code ci-dessus vous donnerait la chaîne d'URL avec les paramètres POST dans l'URL. Il n'est pas impossible d'extraire les paramètres POST.

Pour utiliser jQuery , vous devez inclure la bibliothèque jQuery. Utilisez ce qui suit pour cela:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>

Nous pouvons collecter les paramètres de formulaire soumis en utilisant POST avec le concept de sérialisation .

Essaye ça:

$('form').serialize(); 

Il suffit de le mettre en alerte, il affiche tous les paramètres, y compris caché.

<head><script>var xxx = ${params.xxx}</script></head>

Utilisation de l'expression EL $ {param.xxx} <head>pour obtenir les paramètres d'une méthode post, et assurez-vous que le fichier js est inclus après <head>afin que vous puissiez gérer un paramètre comme «xxx» directement dans votre fichier js.