Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»

Livre en ligne mis à jour

Le chapitre "Rendre les paramètres POST disponibles" a été mis à jour.

Si vous voulez en savoir plus, veuillez "aimer" ou "me suivre" dans Book ;-)


Ce qui suit est un extrait du contenu du livre.


Gérer le corps de la demande

À la fin du chapitre précédent, quand j'ai regardé le résultat de l'accès à / show_requests dans Chrome, j'ai trouvé que le corps de la requête était vide.

Cependant, même si le corps n'était pas vide, notre application Web n'avait encore rien fait pour traduire ou interpréter le corps de la requête. C'est un gros problème, alors soyons capables de gérer le corps de la requête ici.

Le corps de la requête est utilisé pour envoyer des informations supplémentaires (également appelées paramètres) du client au serveur, et est utilisé comme exemple dans la requête de la méthode «POST» (ci-après, requête POST).

Dans ce chapitre, apprenons à gérer le corps de la requête en implémentant le traitement lié aux paramètres de la méthode POST.

Envoyez une requête POST et observez le corps.

Avant de l'expliquer comme "Arekore", commençons par observer comment le corps de la requête est réellement utilisé.

Envoyer une demande POST

Lorsque le navigateur envoie une requête POST, c'est généralement lorsque le bouton soumettre d'un formulaire créé à l'aide de la balise <form> est enfoncé.

Créons en fait du HTML contenant le formulaire et l'expérience.

Créez le code HTML suivant dans study / static.

Le contenu est du HTML rudimentaire et n'a pas besoin d'être expliqué en détail. Il existe différents types de formulaires de saisie tels que les zones de texte, les listes déroulantes et les zones de sélection dans une seule balise <form>.

study/static/form.html https://github.com/bigen1925/introduction-to-web-application-with-python/blob/main/codes/chapter15/static/form.html

De plus, à partir de ce moment, nous modifierons un peu l'en-tête de la réponse. Le codage de la chaîne de caractères peut être spécifié dans l'en-tête Content-Type, et il est nécessaire de spécifier le codage correspondant au japonais pour afficher le japonais sur le navigateur.

L'histoire de l'encodage est compliquée, alors ajoutez-la en pensant que c'est la même chose pour ceux qui ne viennent pas avec une épingle.

study/workerthread.py https://github.com/bigen1925/introduction-to-web-application-with-python/blob/main/codes/chapter15/workerthread.py#L169

Ce fichier se trouve dans le répertoire ** static et est soumis à la livraison de fichiers statiques **, alors accédez à http: // localhsot: 8080 / form.html depuis Chrome avec le serveur en cours d'exécution. Ensuite, vous pouvez l'afficher.


Lorsque l'on clique sur l'élément type =" submit "(ci-après appelé le bouton submit), le navigateur envoie une requête POST à l'URL spécifiée par l'attribut actionde la balise

`. Faire.

Si vous omettez l'hôte et le port pour l'URL spécifiée dans l'attribut action, elle sera envoyée au même hôte / port que la page actuellement ouverte. En d'autres termes, comme cette fois

  • La page actuellement ouverte est http: // localhost: 8080 / form.html --<form action = "/ show_requests">

Dans ce cas, la requête POST sera envoyée à http: // localhost: 8080 / show_requests.


Maintenant, entrez les valeurs dans le formulaire comme indiqué ci-dessous et appuyez sur le bouton Soumettre.

Comme expliqué précédemment, les entrées de ce formulaire seront envoyées à la requête POST / show_requests. Puisque / show_requests aurait dû afficher le contenu de la requête HTTP dans le chapitre précédent, c'est un calcul que vous pouvez voir le contenu de la requête POST avec ceci.

En fait, lorsque vous appuyez sur le bouton Soumettre, vous devriez voir quelque chose comme ce qui suit sur l'écran suivant.

Vous pouvez voir que le corps de la requête contient la valeur, contrairement au cas où vous entrez simplement / show_requests dans la barre d'URL pour naviguer dans la page.

Aussi,

Content-Type: application/x-www-form-urlencoded

Notez également que le nouvel en-tête a été ajouté. Plus tard, j'expliquerai en quoi cet en-tête a beaucoup de sens.

Observez le corps de la requête POST

Maintenant que vous avez vu le contenu spécifique du corps de la requête POST, observons et étudions. Si vous regardez le corps de la requête, vous pouvez voir que les valeurs des formulaires de saisie individuels tels que «zone de texte» et «mot de passe» sont concaténées et transmises dans un format fixe.

Le format est pour un formulaire d'entrée [Valeur de l'attribut de nom de l'élément HTML] = [Valeur saisie dans le formulaire] Il y a une paire appelée, et les valeurs de différentes formes sont reliées par &.

Vous pouvez également voir que «l'espace demi-largeur» a été remplacé par le symbole «+», et le «code de saut de ligne» et «japonais» ont été convertis en une chaîne de caractères mystérieuse ** commençant par ** «%». (Voir la valeur hidden_value pour les valeurs d'entrée japonaises)

De plus, dans le formulaire de saisie qui autorise plusieurs sélections comme l'élément <select>, il semble que plusieurs valeurs soient envoyées avec le même nom. Exemple) check_name = check2 & check_name = check3

De plus, lorsque je regarde le fichier téléchargé, seul * le nom du fichier * est envoyé et le contenu du fichier n'est pas envoyé.

À propos du format des paramètres POST

Lors de l'envoi des données que vous souhaitez envoyer dans une requête POST (ci-après dénommé paramètre POST) au serveur à l'aide du corps de la requête, le format à envoyer est important. Le format ici est multi, quel symbole est utilisé pour représenter les paramètres «nom» et «valeur» dans le corps de la requête, quel symbole est utilisé pour séparer plusieurs données. Comment représenter des caractères d'octets, comment représenter des données binaires telles que des fichiers image, etc.

Il existe différents types de formats, mais si la reconnaissance de cette méthode de formatage est différente côté client et côté serveur, les paramètres envoyés ne peuvent pas être reconnus correctement côté serveur. (Le côté client pense que le symbole = est un "symbole qui sépare nom et valeur ", mais le côté serveur pense que c'est un" code de saut de ligne "et l'interprète. , Ce sera incompréhensible.)

Par conséquent, lors de l'envoi d'une requête POST, il est nécessaire de spécifier le format avec un en-tête appelé «Content-Type» qui indique le format du corps de la requête.

Dans ce cas,

Content-Type: application/x-www-form-urlencoded

Est-ce.

Ci-dessous, je présenterai trois formats couramment utilisés (Content-Type).

application/x-www-form-urlencoded C'est le format par défaut utilisé lorsque le navigateur ne spécifie pas l'attribut enctype dans la balise <form>. Également appelé «encodage d'URL» ou «encodage en pourcentage», le format est défini de manière à ce que diverses données puissent être représentées en utilisant uniquement les caractères pouvant être utilisés comme URL.

Comme nous l'avons vu précédemment,

  1. Concaténez les éléments «nom» et «valeur» avec «=»
  2. Lors de l'envoi de plusieurs éléments, concaténer avec &
  3. Utilisez «+» pour les espaces demi-largeur
  4. Les caractères qui ne peuvent pas être utilisés dans d'autres URL sont codés avec «UTF-8» et la chaîne d'octets est représentée par «% XX».
  5. Impossible de gérer les données binaires qui ne peuvent pas être encodées avec UTF-8 (lors du téléchargement d'un fichier, le contenu du fichier n'est pas envoyé)

Etc.

multipart/form-data Ceci peut être utilisé en le spécifiant explicitement avec l'attribut enctype, tel que <form enctype =" multipart / form-data ">. Jetons un coup d'œil au contenu avant d'expliquer.

Spécifiez le enctype dans l'élément <form> du form.html créé précédemment et soumettez le formulaire.

Remarque

** Si vous souhaitez vérifier l'affichage lors du téléchargement d'un fichier, veuillez utiliser un navigateur appelé «Firefox» au lieu de «Chrome» et envoyer de petites données (comme une image de plusieurs Ko). ** **

Chrome et Safari utilisent keep-alive pour envoyer des demandes à plusieurs reprises lors de l'envoi de données de fichier, mais notre serveur Web ne prend pas en charge keep-alive et envoie des données. C'est parce qu'il ne peut pas être reçu normalement.

Firefox enverra de petites données en une seule demande, afin que vous puissiez recevoir les données normalement.


Vous trouverez ci-dessous un écran qui confirme le comportement avec Firefox, mais si vous rencontrez des difficultés pour installer Firefox, veuillez vérifier l'opération ** sans télécharger le fichier dans Chrome. Tout formulaire autre qu'un fichier, tel qu'un formulaire texte, doit recevoir les données.

La première chose à noter est que chaque élément des données du formulaire est séparé par un séparateur spécial. (Dans ce cas, le séparateur est --------------------------- 10847194838586372301567045317)


Continuez avec Book!

Chapitre "Etre capable de gérer les paramètres POST"

Recommended Posts

Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»
Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»
Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»
Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»
Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»
Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»
Mise à jour de «Introduction à l'accueil de l'application Web Python pour les ingénieurs Web de 3e année qui sont lents»
[Introduction à l'application Udemy Python3 +] 43. instruction for else
Introduction à Python pour, pendant
[Introduction à l'application Udemy Python3 +] 42. pour instruction, instruction break et instruction continue
[Présentation de l'application Udemy Python3 +] 58. Lambda
[Présentation de l'application Udemy Python3 +] 31. Commentaire
[Présentation de l'application Udemy Python3 +] 57. Décorateur
[Présentation de l'application Udemy Python3 +] 59. Générateur
[Introduction à l'application Udemy Python3 +] Résumé
Premiers pas avec Python pour les non-ingénieurs
Explication facile à comprendre de l'application Web Python (Django) même pour les débutants (5) [Introduction au fonctionnement de la base de données avec le shell Django]
[Introduction à Udemy Python3 + Application] 18. Méthode List
[Introduction à l'application Udemy Python3 +] 28. Type collectif
[Introduction à Udemy Python3 + Application] 25. Méthode de type dictionnaire
[Introduction à l'application Udemy Python3 +] 33. instruction if
[Introduction à l'application Udemy Python3 +] 55. Fonctions intégrées
[Introduction à l'application Udemy Python3 +] 48. Définition des fonctions
[Introduction à l'application Udemy Python3 +] 10. Valeur numérique
[Introduction à l'application Udemy Python3 +] 21. Type Taple
[Introduction à l'application Udemy Python3 +] 45. fonction enumerate
[Introduction à l'application Udemy Python3 +] 41. fonction d'entrée
[Introduction à l'application Udemy Python3 +] 17. Opération de liste
[Introduction à l'application Udemy Python3 +] 65. Gestion des exceptions
[Introduction à l'application Udemy Python3 +] 11. Chaîne de caractères
[Introduction à l'application Udemy Python3 +] 44. fonction range
[Introduction à l'application Udemy Python3 +] 46. fonction zip
[Introduction à l'application Udemy Python3 +] 24. Type de dictionnaire
[Python] Conception d'applications Web pour l'apprentissage automatique
Une introduction à Python pour l'apprentissage automatique
[Introduction à Udemy Python3 + Application] 8. Déclaration de variable
[Introduction à Udemy Python3 + Application] 29. Méthode Set
[Introduction à l'application Udemy Python3 +] 16. Type de liste
[Introduction à Udemy Python3 + Application] 61. Notation d'inclusion de dictionnaire
[Introduction à l'application Udemy Python3 +] 22. Déballage de taples
Une introduction à Python pour les programmeurs en langage C
[Introduction à Udemy Python3 + Application] 47. Traitez le dictionnaire avec une instruction for
Prenons la version gratuite "Introduction à Python pour l'apprentissage automatique" en ligne jusqu'au 27/04
Une introduction aux applications Web Python auto-conçues pour un ingénieur Web de troisième année paresseux
Explication facile à comprendre de l'application Web Python (Django) même pour les débutants (4) [Route setting / Introduction to MTV design patterns]
[Introduction à Udemy Python3 + Application] 26. Copie du dictionnaire
[Introduction à l'application Udemy Python3 +] 23. Comment utiliser Tapuru
[Introduction à Udemy Python3 + Application] 60. Notation d'inclusion de liste
[Introduction à Udemy Python3 + Application] 38. Lors du jugement Aucun
Introduction à Tornado (1): Framework Web Python démarré avec Tornado
[Introduction à l'application Udemy Python3 +] 40. Instruction while else
[Introduction à Udemy Python3 + Application] 62. Définir la notation d'inclusion
Étapes pour développer une application Web en Python
[Introduction à l'application Udemy Python3 +] 64. Espace de noms et portée
[Introduction à Python3 Jour 20] Chapitre 9 Démêler le Web (9.1-9.4)
[Introduction à Udemy Python3 + Application] 67. Arguments de ligne de commande
[Introduction à l'application Udemy Python3 +] 9. Tout d'abord, imprimez avec print
[Introduction à Udemy Python3 + Application] 37. Technique pour juger qu'il n'y a pas de valeur
Comprendre le développement de Python pour Pepper. -Introduction à Python Box-
[Introduction à l'application Udemy Python3 +] 66. Création de votre propre exception
(Python) Essayez de développer une application Web en utilisant Django