Skip to content

Remove {{exception}} macro - fr #5409

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
May 4, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
67 changes: 39 additions & 28 deletions files/fr/web/api/crypto/getrandomvalues/index.md
Original file line number Diff line number Diff line change
@@ -1,60 +1,71 @@
---
title: RandomSource.getRandomValues()
title: Crypto.getRandomValues()
slug: Web/API/Crypto/getRandomValues
tags:
- API
- Cryptographie
- Methode(2)
- Méthode
- Reference
- Référence(2)
translation_of: Web/API/Crypto/getRandomValues
original_slug: Web/API/RandomSource/getRandomValues
browser-compat: api.Crypto.getRandomValues
---
{{APIRef("Web Crypto API")}}

La méthode **`RandomSource.getRandomValues()`** permet dobtenir des valeurs pseudo-aléatoires cryptographiquement satisfaisantes. Le tableau donné en paramètre est rempli avec des nombres pseudo-aléatoires.
La méthode **`Crypto.getRandomValues()`** permet d'obtenir des valeurs aléatoires suffisamment fortes pour un usage cryptographique. Le tableau fourni en paramètre est rempli de nombres aléatoires (au sens cryptographique).

Pour garantir une performance suffisante, les implémentations n’utilisent pas un vrai générateur de nombres aléatoires, mais un générateur de nombres pseudo-aléatoires _semé_ avec une valeur ayant suffisamment d'{{Glossary("entropie")}}. Les générateurs utilisés d’une implémentation à une autre seront différents mais toujours satisfaisants pour une utilisation en cryptographie. Les implémentations doivent également utiliser une graine ayant suffisamment d’entropie, comme une source d’entropie au niveau du système.
Pour garantir des performances suffisantes, les implémentations n'utilisent pas un générateur de nombres aléatoires, mais un générateur de nombres pseudo-aléatoires _amorcé_ (<i lang="en">seeded</i>) avec une graine ayant suffisamment d'entropie. L'algorithme du générateur de nombres pseudo-aléatoires (PRNG) peut varier selon les [agents utilisateur](/fr/docs/Glossary/User_agent), mais est considéré comme satisfaisant pour un usage cryptographique. Les implémentations doivent utiliser une graine ayant suffisamment d'entropie, telle qu'une source d'entropie au niveau du système.

`getRandomValues()` est la seule propriété de l'interface `Crypto` qui peut être utilisée depuis un contexte non-sécurisé.

## Syntaxe

cryptoObj.getRandomValues(typedArray);
```js
getRandomValues(typedArray)
```

### Paramètres

- _typedArray_
- : Un {{jsxref("TypedArray")}} de nombres entiers, qui est un {{jsxref("Int8Array")}}, un {{jsxref("Uint8Array")}}, un {{jsxref("Uint16Array")}}, un {{jsxref("Int32Array")}}, ou encore un {{jsxref("Uint32Array")}}. Tous les éléments du tableau seront subsitués avec des nombres aléatoires.
- `typedArray`
- : Un tableau typé ([`TypedArray`](/fr/docs/Web/JavaScript/Reference/Global_Objects/TypedArray)) utilisant des valeurs entières, c'est-à-dire une valeur dont le type est l'un des types suivants&nbsp;: [`Int8Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Int8Array), [`Uint8Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array), [`Uint8ClampedArray`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Uint8ClampedArray), [`Int16Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Int16Array), [`Uint16Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Uint16Array), [`Int32Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Int32Array), [`Uint32Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Uint32Array), [`BigInt64Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/BigInt64Array), [`BigUint64Array`](/fr/docs/Web/JavaScript/Reference/Global_Objects/BigUint64Array) (mais **pas** `Float32Array` ni `Float64Array`). Tous les éléments du tableau seront écrasés avec des nombres aléatoires.

### Valeur de retour

La valeur de retour correspond au même tableau que celui passé en argument mais dont le contenu a été remplacé par des nombres aléatoires générés pour l'occasion. On notera que `typedArray` est modifié directement, il n'y a pas de copie effectuée.

### Exceptions

- Une {{exception("QuotaExceededError")}} {{domxref("DOMException")}} est levée si la taille de la requête est plus grand que 65 536 octets.
Cette méthode peut lever une exception dans certaines conditions.

- [`DOMException`](/fr/docs/Web/API/DOMException) (avec le nom [`QuotaExceededError`](/fr/docs/Web/API/DOMException#quotaexceedederror))
- : La longueur demandée dépasse 65536 octets.

## Notes d'utilisation

`getRandomValues()` ne doit pas être utilisée afin de générer des clés de chiffrement. Il faut utiliser la méthode [`generateKey()`](/fr/docs/Web/API/SubtleCrypto/generateKey) à la place. En effet, plusieurs raisons invitent à ce choix et notamment le fait que `getRandomValues()` puisse être exécutée depuis un contexte non sécurisé.

Il n'y a pas de seuil minimal d'entropie imposé par la spécification pour la cryptographie web. Les agents utilisateurs doivent fournir la meilleure entropie possible lors de la génération de nombres aléatoires en utilisant un générateur de nombres pseudo-aléatoires bien défini et efficace, construit au sein de l'agent utilisateur mais amorcé avec des graines provenant d'une source de nombres pseudo-aléatoires externe, comme une fonction spécifique à la plateforme sous-jacente (par exemple, l'appareil `/dev/urandom` sur Unix) ou une autre source de données aléatoires ou pseudo-aléatoires.

## Exemple
## Exemples

```js
/* on part du principe ici que window.crypto.getRandomValues est disponible */
/* En partant du principe que window.crypto.getRandomValues */
/* est disponible */

var array = new Uint32Array(10);
window.crypto.getRandomValues(array);
let array = new Uint32Array(10);
self.crypto.getRandomValues(array);

console.log("Your lucky numbers:");
for (var i = 0; i < array.length; i++) {
console.log(array[i]);
console.log('Votre tirage du jour :');
for (let i = 0; i < array.length; i++) {
console.log(array[i]);
}
```

## Spécification
## Spécifications

| Specification | Status | Comment |
| -------------------------------------------------------------------------------------------- | ------------------------------------ | ------------------ |
| {{SpecName('Web Crypto API', '#RandomSource-method-getRandomValues')}} | {{Spec2('Web Crypto API')}} | Initial definition |
{{Specifications}}

## Compatibilité des navigateurs

{{Compat("api.Crypto.getRandomValues")}}
{{Compat}}

## Voir aussi

- {{ domxref("Window.crypto") }} pour obtenir un objet {{domxref("Crypto")}}.
- {{jsxref("Math.random")}}, une source non cryptographique de nombres aléatoires.
- [L'API Web Crypto](/fr/docs/Web/API/Web_Crypto_API)
- [`crypto`](/fr/docs/Web/API/crypto_property) qui permet d'obtenir un objet [`Crypto`](/fr/docs/Web/API/Crypto)
- [`Math.random()`](/fr/docs/Web/JavaScript/Reference/Global_Objects/Math/random), une fonction qui permet de générer des nombres aléatoires à des fins non-cryptographiques.
107 changes: 53 additions & 54 deletions files/fr/web/api/element/closest/index.md
Original file line number Diff line number Diff line change
@@ -1,43 +1,41 @@
---
title: Element.closest()
slug: Web/API/Element/closest
tags:
- API
- DOM
- Element
- Méthodes
translation_of: Web/API/Element/closest
browser-compat: api.Element.closest
---
{{APIRef('Shadow DOM')}}
{{APIRef('DOM')}}

La méthode **`Element.closest()`** renvoie l'ancêtre le plus proche de l'élément courant (ou l'élément courant) qui correspond aux sélecteurs passés comme paramètres. S'il n'existe pas de tel ancêtre, la méthode renvoie `null`.
La méthode **`closest()`** traverse [l'élément](/fr/docs/Web/API/Element) courant et ses parents (en direction de la racine) jusqu'à trouver un nœud qui correspond aux sélecteurs exprimés par la chaîne de caractères passée en argument. Elle renverra l'élément ou l'ancêtre le plus proche qui correspond. Si aucun élément ne correspond, la méthode renvoie `null`.

## Syntaxe

var elt = element.closest(selecteurs);
```js
closest(selecteurs)
```

### Paramètres

- `selecteurs`
- : Une chaîne {{domxref("DOMString")}} qui contient une liste de sélecteurs tels que `"p:hover, .toto + q"`
- : Une chaîne de caractères contenant une liste de sélecteurs. Par exemple `p:hover, .toto + q`.

### Valeur de retour

L'élément ({{domxref("Element")}}) qui est le plus proche ancêtre de l'élément courant et qui correspond aux sélecteurs décrits dans le paramètres ou {{jsxref("null")}} s'il n'y en a aucun.
L'élément ([`Element`](/fr/docs/Web/API/Element)) qui est l'ancêtre le plus proche de l'élément courant et qui correspond aux sélecteurs. S'il n'y en a aucun, ce sera `null`.

### Exceptions

- {{exception("SyntaxError")}} sera levée si `selecteurs` n'est pas une liste de sélecteurs valide.
Une exception [`SyntaxError`](/fr/docs/Web/API/DOMException#syntaxerror) est levée si la chaîne de caractères `selecteurs` n'est pas une liste de sélecteurs valide.

## Exemples

### HTML

```html
<article>
<div id="div-01">Here is div-01
<div id="div-02">Here is div-02
<div id="div-03">Here is div-03</div>
<div id="div-01">Voici div-01
<div id="div-02">Voici div-02
<div id="div-03">Voici div-03</div>
</div>
</div>
</article>
Expand All @@ -46,52 +44,53 @@ L'élément ({{domxref("Element")}}) qui est le plus proche ancêtre de l'élém
### JavaScript

```js
var el = document.getElementById('div-03');
const el = document.getElementById('div-03');

var r1 = el.closest("#div-02");
// Renvoie l'élément avec l'identifiant id=div-02
const r1 = el.closest('#div-02');
// Renvoie l'élément avec l'identifiant div-02

var r2 = el.closest("div div");
// Renvoie le plus proche ancêtre qui est un div
// dans un div. Ici, c'est div-03 lui-même.
const r2 = el.closest('div div');
// Renvoie le plus proche ancêtre qui est un div dans un div
// Ici, c'est div-03 lui-même

var r3 = el.closest("article > div");
// Renvoie le plus proche ancêtre qui est un div
// et dont l'élément parent est article. Ici c'est
// div-01.
const r3 = el.closest('article > div');
// Renvoie le plus proche ancêtre qui est un div et qui a un
// article parent, il s'agit ici de div-01

var r4 = el.closest(":not(div)");
// Renvoie le plus proche ancêtre qui n'est pas un
// div. Dans ce cas, c'est l'élément article.
const r4 = el.closest(':not(div)');
// Renvoie le plus proche ancêtre qui n'est pas un div,
// c'est l'article englobant
```

## Polyfill
## Prothèse d'émulation (<i lang="en">polyfill</i>)

Pour les navigateurs qui ne prennent pas en charge `Element.closest()` mais qui permettent d'utiliser `element.matches()` (ou un équivalent préfixé, à partir d'IE9+), on peut utiliser le polyfill suivant :
Pour les navigateurs qui ne prennent pas en charge `Element.closest()`, mais qui implémentent `element.matches()` (ou un équivalent préfixé comme IE9+), il est possible d'implémenter une prothèse&nbsp;:

```js
if (!Element.prototype.matches)
Element.prototype.matches = Element.prototype.msMatchesSelector ||
Element.prototype.webkitMatchesSelector;

if (!Element.prototype.closest)
Element.prototype.closest = function(s) {
var el = this;
if (!document.documentElement.contains(el)) return null;
do {
if (el.matches(s)) return el;
el = el.parentElement || el.parentNode;
} while (el !== null && el.nodeType == 1);
return null;
};
if (!Element.prototype.matches) {
Element.prototype.matches =
Element.prototype.msMatchesSelector ||
Element.prototype.webkitMatchesSelector;
}

if (!Element.prototype.closest) {
Element.prototype.closest = function(s) {
var el = this;

do {
if (Element.prototype.matches.call(el, s)) return el;
el = el.parentElement || el.parentNode;
} while (el !== null && el.nodeType === 1);
return null;
};
}
```

Cependant, si vous avez besoin de supporter IE 8, vous pouvez utiliser la prothèse suivante qui marchera, mais beaucoup plus lentement. Elle ne supporte que les sélecteurs CSS 2.1 dans IE 8, et peut causer de gros pics de latence dans les sites web :
Si la prise en charge d'IE8 est nécessaire, le fragment de code qui suit fera l'affaire (lentement mais sûrement). Toutefois, il ne prend en charge que les sélecteurs CSS 2.1 pour IE8 et entraînera une importante baisse de performance pour les sites web en production.

```js
if (window.Element && !Element.prototype.closest) {
Element.prototype.closest =
function(s) {
Element.prototype.closest = function(s) {
var matches = (this.document || this.ownerDocument).querySelectorAll(s),
i,
el = this;
Expand All @@ -106,20 +105,20 @@ if (window.Element && !Element.prototype.closest) {

## Spécifications

| Spécification | Statut | Commentaire |
| ------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------- |
| {{SpecName('DOM WHATWG', '#dom-element-closest', 'Element.closest()')}} | {{Spec2('DOM WHATWG')}} | Définition initiale. |
{{Specifications}}

## Compatibilité des navigateurs

{{Compat("api.Element.closest")}}
{{Compat}}

### Notes de compatibilité

- Dans Edge `document.createElement(tagName).closest(tagName)` retournera `null` si l'élément n'est pas attaché au DOM au préalable.
- Pour Edge 15-18, `document.createElement(tagName).closest(tagName)` renverra `null` si l'élément n'est pas d'abord connecté (directement ou indirectement) à l'objet de contexte, par exemple l'objet [`Document`](/fr/docs/Web/API/Document) dans le cas du DOM classique.

## Voir aussi

- L'interface {{domxref("Element")}}
- [La syntaxe pour les sélecteurs](/fr/Apprendre/CSS/Les_bases/Les_sélecteurs)
- Autres méthodes utilisant des sélecteurs: {{domxref("element.querySelector()")}} et {{domxref("element.matches()")}}.
- L'interface [`Element`](/fr/docs/Web/API/Element)
- [La syntaxe des sélecteurs CSS](/fr/docs/Learn/CSS/Building_blocks/Selectors)
- Les autres méthodes qui utilisent des sélecteurs en argument&nbsp;:
- [`element.querySelector()`](/fr/docs/Web/API/Element/querySelector)
- [`element.matches()`](/fr/docs/Web/API/Element/matches)