formulaire.md 4,9 ko
Newer Older
salim's avatar
salim a validé
# Les formulaires

---

## Rappel de HTTP

![HTTP Image](https://cours.salimkhraimeche.fr/images/http.png)

---

## Création du formulaire
Fichier `form.html`
```HTML
<form action="process.php" method="get">
    <label for="name">Name:</label>
    <input type="text" name="input_get">
    <input type="submit" value="Submit">
</form>
```

Fichier `process.php`
```php
$name = $_GET['input_get'];
echo "Hello, " . $name . "!";
```

---
## Différents types d'input
### Champ de texte

```HTML
    <input type="text" name="input_text">
    <input type="password" name="input_password">
    <input type="email" name="input_email">
<TextArea name="input_longtext"></TextArea>
```

<input type="text" name="input_text" placeholder="Text">
<input type="password" name="input_password" placeholder="Password">
<input type="email" name="input_email" placeholder="email">
<TextArea name="input_longtext">Lorem ipsum dolor sit amet</TextArea>

---
## Différant type d'input
### Boutons

```HTML
    <input type="button" value="Click me">
    <input type="reset" value="Reset me">
    <input type="submit" value="Send me">
```
<form>
<input type="text">

<input type="button" value="Click me"/>
<input type="reset" value="Reset me"/>
<input type="submit" value="Send me"/>
</form>


---
## Différant type d'input
### Séléction

```HTML
<label for="checkbox1">Check me</label>
<input type="checkbox" id="checkbox1" />

<label for="checkbox2">Check me too</label>
<input type="checkbox" id="checkbox2" />
```
<label for="checkbox1">Check me</label>
<input type="checkbox" id="checkbox1" />

<label for="checkbox2">Check me too</label>
<input type="checkbox" id="checkbox2" />
---
## Différant type d'input
### Séléction

```HTML
<label for="radio1">Option 1</label>
<input type="radio" id="radio1" value="option1" />

<label for="radio2">Option 2</label>
<input type="radio" id="radio2" value="option2" />
```

<label for="radio1">Option 1</label>
<input type="radio" id="radio1" value="option1" />

<label for="radio2">Option 2</label>
<input type="radio" id="radio2" value="option2" />
---
## Différant type d'input
### Séléction

```HTML
<label for="inputWithList">Choose a fruit:</label>
<Input id="inputWithList" list="fruits"/>
<datalist id="fruits">
    <option value="Apple" />
    <option value="Banana" />
    <option value="Cherry" />
    <option value="Date" />
    <option value="Grape" />
</datalist>
```

<form>
<label for="inputWithList">Choose a fruit:</label>
<Input id="inputWithList" list="fruits"/>
<datalist id="fruits">
  <option value="Apple" />
  <option value="Banana" />
  <option value="Cherry" />
  <option value="Date" />
  <option value="Grape" />
</datalist>
</form>

---
## Différant type d'input
### Séléction

```HTML
<label for="select1">Choose a fruit:</label>
<select id="select1">
    <option value="Apple">Apple</option>
    <option value="Banana">Banana</option>
    <option value="Cherry">Cherry</option>
    <option value="Date" selected>Date</option>
    <option value="Grape">Grape</option>
</select>

```

<form>
<label for="select1">Choose a fruit:</label>
<select id="select1">
  <option value="Apple">Apple</option>
  <option value="Banana">Banana</option>
  <option value="Cherry">Cherry</option>
  <option value="Date" selected>Date</option>
  <option value="Grape">Grape</option>
</select>

</form>

---
## Traitement des données
### La méthode GET
- Les données sont envoyées dans l'URL sous le format :
`?name1=value1&name2=value2`
- Les données sont visibles dans l'URL (peu sécurisé).
- Elles sont récupérées dans PHP via les variables :
  - `$_GET`
  - `$_REQUEST`


---
## Traitement des données
### La méthode POST
- Les données sont envoyées dans le corps de la requête.
- Si HTTPS est utilisé, les données sont chiffrées.
- Elles sont récupérées dans PHP via les variables :
  - `$_POST`
  - `$_REQUEST`


---
## Traitement des données
### exemple
formEtAffiche.php
```php
<?php
  if (empty($_REQUEST['nom'])) {
    echo '<form action="formEtAffiche.php" method="get">
        <label for="nom">Saisir un nom</label> 
        <input type="text" name="nom">
    </form>';
  } else  {
    $nom=$_REQUEST['nom'];	
    echo "<h2>AFFICHE</h2>";
    echo "Le nom est $nom";
  }
?>
```
---
## Traitement des données
### La faille XSS
```html
<script>
    setInterval(function() {
      // Ajoute un div à la page
      const div = document.createElement('div');
      div.innerHTML = 'Fork bomb !!!';
      document.body.appendChild(div);
      // Ouvre un nouvel onglet 
      window.open(window.location.href,'about:blank'); 
    }, 1);
</script>
```
<small>Ce script va rapidement ajouter des div a la page HTML</small><br/>
<a href="http://localhost:8001/formEtAffiche.php" target="_blank">Exemple</a>


---
# DVWA 
### DAMN VULNERABLE WEB APPLICATION
<small>/!\ Interdiction d'installer cet outil sur les postes ou le serveur Docker de l'IUT /!\ </small>
<img src="../../img/dvwa.svg" style="height: 30vh" alt="accessibility text">