jQuery - Méthod...LOGIN

jQuery - Méthodes AJAX get() et post()

Requête HTTP : GET vs. POST

Deux méthodes courantes de requête-réponse côté client et côté serveur sont : GET et POST.

GET - Demander des données à la ressource spécifiée POST - Soumettre les données à traiter à la ressource spécifiée

GET est essentiellement utilisé pour obtenir (récupérer) des données du serveur. Remarque : La méthode GET peut renvoyer des données mises en cache.

POST peut également être utilisé pour obtenir des données du serveur. Cependant, la méthode POST ne met pas en cache les données et est souvent utilisée pour envoyer des données avec la requête.


La différence entre Get et Post

Méthode Get :
Utiliser get méthode Des données simples peuvent être transmises, mais leur taille est généralement limitée à 1 Ko. Les données sont ajoutées à l'URL et envoyées (transmission d'en-tête HTTP). au format des paramètres URL derrière le chemin de la ressource. Le point le plus important est qu'il sera mis en cache par le navigateur du client, afin que d'autres puissent lire les données du client, telles que le numéro de compte et le mot de passe, etc., à partir de l'historique du navigateur. Par conséquent, dans certains cas, la méthode get peut entraîner de graves problèmes de sécurité.

Méthode Post :
Lors de l'utilisation de la méthode POST, le navigateur envoie chaque élément de champ de formulaire et ses données en tant que contenu d'entité du HTTP message Au serveur Web, au lieu de le transmettre en paramètre de l'adresse URL, la quantité de données transmises via POST est bien supérieure à celle transmise via GET.

En bref, la méthode GET transmet une petite quantité de données, a une efficacité de traitement élevée et une faible sécurité, et sera mise en cache, alors que l'inverse est vrai pour POST. Méthode


$.get() La méthode

$.get() demande des données au serveur via une requête HTTP GET .

Syntaxe :

$.get(URL,callback);

URL requise les paramètres spécifient l’URL que vous souhaitez demander.

Le paramètre de rappel facultatif est le nom de la fonction à exécuter une fois la requête réussie.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        $("button").click(function(){
            $.get("/try/ajax/demo_test.php",function(data,status){   //需要引入demo_test.php文件
                alert("数据: " + data + "\n状态: " + status);
            });
        });
    });
</script>
</head>
<body>
  <button>发送一个GET 请求并获取返回结果</button>
</body>
</html>

Le premier paramètre de $.get() est l'URL que nous souhaitons demander ("demo_test.php").

Le deuxième paramètre est la fonction de rappel. Le premier paramètre de rappel stocke le contenu de la page demandée et le deuxième paramètre de rappel stocke l'état de la demande.

Ce fichier PHP ("demo_test.php") ressemble à ceci :

<?php
   echo "这是个从PHP文件中读取的数据";
?>


Méthode

$.post()

La méthode $.post() demande des données au serveur via une requête HTTP POST.

Syntaxe :

$.post(URL,data,callback);

Paramètres d'URL requis Spécifier l'URL que vous souhaitez demander.

Le paramètre facultatif data spécifie les données à envoyer avec la requête.

Le paramètre de rappel facultatif est le nom de la fonction à exécuter une fois la requête réussie.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        $("button").click(function(){
            $.post("/try/ajax/demo_test_post.php",{
            name:"php中文网",
            url:"http://www.php.cn"
            },
            function(data,status){
            alert("数据: \n" + data + "\n状态: " + status);
            });
        });
    });
</script>
</head>
<body>
   <button>发送一个 HTTP POST 请求页面并获取返回内容</button>
</body>
</html>

Le premier paramètre de $.post() est l'URL que nous souhaitons demander ("demo_test_post.php").

Ensuite, nous envoyons les données avec la demande (nom et ville).

Le script PHP dans "demo_test_post.php" lit ces paramètres, les traite et renvoie les résultats.

Le troisième paramètre est la fonction de rappel. Le premier paramètre de rappel stocke le contenu de la page demandée, tandis que le deuxième paramètre stocke l'état de la demande.

Ce fichier PHP ("demo_test_post.php") ressemble à ceci :

<?php
    $name = isset($_POST['name']) ? htmlspecialchars($_POST['name']) : '';
    $city = isset($_POST['url']) ? htmlspecialchars($_POST['url']) : '';
    echo '网站名: ' . $name;
    echo "\n";
    echo 'URL 地址: ' .$city;
?>


Un exemple complet de $.post() :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>php中文网(php.cn)</title>
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript">
        function checkname(){
            if($('#name').val() == ""){
                $('#msg').html("please enter the name!");
                $('#name').focus;
                return false;
            }
            if($('#address').val() == ""){
                $('#msg').html("please enter the address!");
                $('#address').focus;
                return false;
            }
            ajax_post();
        }
        function ajax_post(){
            $.post("text.php",{name:$('#name').val(),address:$('#address').val()},
                    function(data){
                        //$('#msg').html("please enter the name!");
                        //alert(data);
                        $('#msg').html(data);
                    },
                    "text");
        }
    </script>
</head>
<body>
    <form id="ajaxform" name="ajaxform" method="post" action="text.php">
        <p>
            name<input type="text" name="name" id="name"/>
        </p>
        <p>
            address<input type="text" name="address" id="address"/>
        </p>
        <p id="msg"></p>
        <p>
            <input name="Submit" type="button" value="submit" onclick="return checkname()"/>
        </p>
    </form>
</body>
</html>

Créer un fichier text.php :

<?php
    $name = $_POST["name"];
    $address = $_POST["address"];
    echo $name."<br>";
    echo $address."<br>";
    echo "success";
?>


section suivante
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript"> function checkname(){ if($('#name').val() == ""){ $('#msg').html("please enter the name!"); $('#name').focus; return false; } if($('#address').val() == ""){ $('#msg').html("please enter the address!"); $('#address').focus; return false; } ajax_post(); } function ajax_post(){ $.post("text.php",{name:$('#name').val(),address:$('#address').val()}, function(data){ //$('#msg').html("please enter the name!"); //alert(data); $('#msg').html(data); }, "text"); } </script> </head> <body> <form id="ajaxform" name="ajaxform" method="post" action="text.php"> <p> name<input type="text" name="name" id="name"/> </p> <p> address<input type="text" name="address" id="address"/> </p> <p id="msg"></p> <p> <input name="Submit" type="button" value="submit" onclick="return checkname()"/> </p> </form> </body> </html>
soumettreRéinitialiser le code
chapitredidacticiel