1 files changed, 275 insertions, 0 deletions
diff --git a/files/fr/web/api/url/index.html b/files/fr/web/api/url/index.html
new file mode 100644
index 0000000000..0036163e08
--- /dev/null
+++ b/files/fr/web/api/url/index.html
@@ -0,0 +1,275 @@
+---
+title: URL
+slug: Web/API/URL
+tags:
+  - API
+  - References
+  - URL
+translation_of: Web/API/URL
+---
+<div>{{ApiRef("URL API")}}</div>
+
+<p>L'interface <strong><code>URL</code></strong><strong> </strong>représente un objet qui fournit des méthodes statiques utilisées pour créer des URL d'objet.</p>
+
+<p><span id="result_box" lang="fr"><span>Lors de l'utilisation d'un agent utilisateur dans lequel aucun constructeur n'a encore été implémenté, il est possible d'accéder à un objet en utilisant les propriétés</span></span> {{domxref("Window.URL")}} (préfixées sur un navigateur basé sur Webkit tel que <code>Window.webkitURL</code>).</p>
+
+<p>{{AvailableInWorkers}}</p>
+
+<h2 id="Utilisation">Utilisation</h2>
+
+<p>Le constructeur <span id="result_box" lang="fr"><span>prend un paramètre url et un paramètre de base facultatif à utiliser comme base si le paramètre url est une URL relative :</span></span></p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">const</span> url <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">URL</span><span class="punctuation token">(</span><span class="string token">'../cats'</span><span class="punctuation token">,</span> <span class="string token">'http://www.example.com/dogs'</span><span class="punctuation token">)</span><span class="punctuation token">;</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>url<span class="punctuation token">.</span>hostname<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// "www.example.com"</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>url<span class="punctuation token">.</span>pathname<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// "/cats"</span></code></pre>
+
+<p>Les propriétés de l'URL peuvent être définies pour construire l'URL :</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">url<span class="punctuation token">.</span>hash <span class="operator token">=</span> <span class="string token">'tabby'</span><span class="punctuation token">;</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>url<span class="punctuation token">.</span>href<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// "http://www.example.com/cats#tabby"</span></code></pre>
+
+<p>Les URL seront encodées selon la norme RFC 3986:</p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">url<span class="punctuation token">.</span>pathname <span class="operator token">=</span> <span class="string token">'démonstration.html'</span><span class="punctuation token">;</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>url<span class="punctuation token">.</span>href<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// "http://www.example.com/d%C3%A9monstration.html"</span></code></pre>
+
+<p>L'interface {{domxref("URLSearchParams")}}  peut être utilisée pour construire et manipuler la chaîne de requête de l'URL.</p>
+
+<p><span id="result_box" lang="fr"><span>Pour obtenir les paramètres de recherche à partir de l'URL de la fenêtre en cours :</span></span></p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="comment token">// https://some.site/?id=123</span>
+<span class="keyword token">var</span> parsedUrl <span class="operator token">=</span> <span class="keyword token">new</span> <span class="class-name token">URL</span><span class="punctuation token">(</span>window<span class="punctuation token">.</span>location<span class="punctuation token">.</span>href<span class="punctuation token">)</span><span class="punctuation token">;</span>
+console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>parsedUrl<span class="punctuation token">.</span>searchParams<span class="punctuation token">.</span><span class="keyword token">get</span><span class="punctuation token">(</span><span class="string token">"id"</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// 123</span></code></pre>
+
+<p>La méthode <code>stringifier</code> de l' <code>URL</code> est la propriété <code>href</code> , ainsi le constructeur<span id="result_box" lang="fr"><span> peut être utilisé pour normaliser et encoder directement une URL :</span></span></p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js"><span class="keyword token">const</span> response <span class="operator token">=</span> <span class="keyword token">await</span> <span class="function token">fetch</span><span class="punctuation token">(</span><span class="keyword token">new</span> <span class="class-name token">URL</span><span class="punctuation token">(</span><span class="string token">'http://www.example.com/démonstration.html'</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<h2 id="Constructeur">Constructeur</h2>
+
+<dl>
+ <dt>{{domxref("URL.URL", "URL()")}} {{experimental_inline}}</dt>
+ <dd>Crée et retourne un objet <code>URL</code>  composé des paramètres donnés.</dd>
+</dl>
+
+<h2 id="Propriétés">Propriétés</h2>
+
+<dl>
+ <dt>{{domxref("URL.hash")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant un <code>'#'</code> <span class="short_text" id="result_box" lang="fr"><span>suivi de l'identifiant du fragment de l'URL.</span></span></dd>
+ <dt>{{domxref("URL.host")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant l'hôte, c'est-à-dire le <em>hostname (nom d'hôte)</em>, <code>':'</code>et le <em>port</em> de l'URL.</dd>
+ <dt>{{domxref("URL.hostname")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant le domaine de l'URL.</dd>
+ <dt>{{domxref("URL.href")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant l'URL entière.</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("URL.origin")}} {{readonlyInline}}</dt>
+ <dd>Retourne une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant l'origine de l'URL, <span class="short_text" id="result_box" lang="fr"><span>c'est son schéma, son domaine et son port</span></span> .</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("URL.password")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant le mot de passe spécifié avant le nom du domaine.</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("URL.pathname")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant une barre oblique initiale <code>'/'</code>suivie du chemin de l'URL.</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("URL.port")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant le numéro de port de l'URL.</dd>
+</dl>
+
+<dl>
+ <dt>{{domxref("URL.protocol")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant le schéma du protocole de l'URL, y compris le final <code>':'</code>.</dd>
+ <dt>{{domxref("URL.search")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant un <code>'?'</code> suivi par les paramètres de l'URL.</dd>
+ <dt>{{domxref("URL.searchParams")}}</dt>
+ <dd>Retourne un objet {{domxref("URLSearchParams")}}  <span id="result_box" lang="fr"><span>permettant d'accéder aux arguments de requête GET contenus dans l'URL.</span></span></dd>
+ <dt>{{domxref("URL.username")}}</dt>
+ <dd>Est une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant<span id="result_box" lang="fr"><span> le nom d'utilisateur spécifié avant le nom de domaine.</span></span></dd>
+</dl>
+
+<h2 id="Méthodes">Méthodes</h2>
+
+<p><em>L'interface <code>URL</code> </em> <span id="result_box" lang="fr"><span>implémente les méthodes définies dans </span></span><em>{{domxref("URLUtils")}}.</em></p>
+
+<dl>
+ <dt>{{domxref("URLUtils.toString()")}}</dt>
+ <dd>Retourne une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant l'URL entière. C'est un synonyme de {{domxref("URLUtils.href")}}, mais il ne peut pas être utilisé pour modifier la valeur.</dd>
+ <dt>{{domxref("URL.toJSON()")}} <sup>[disponible depuis FireFox v54]</sup></dt>
+ <dd>Retourne une {{domxref("DOMString")}}   <em>(chaîne de caractères)</em> contenant l'URL entière. Il retourne la même chaîne que la propriété <code>href</code> .</dd>
+</dl>
+
+<h2 id="Méthodes_statiques">Méthodes statiques</h2>
+
+<dl>
+ <dt>{{ domxref("URL.createObjectURL()") }}</dt>
+ <dd>Retourne une {{domxref("DOMString")}} <em>(chaîne de caractères)</em> contenant un "blob URL" unique ; c'est une URL avec <code>blob :</code> <span id="result_box" lang="fr"><span>son schéma suivi d'une chaîne opaque identifiant de manière unique l'objet dans le navigateur.</span></span></dd>
+ <dt>{{ domxref("URL.revokeObjectURL()") }}</dt>
+ <dd><span id="result_box" lang="fr"><span>Révoque un objet URL précédemment créé avec {{domxref ("URL.createObjectURL ()")}}.</span></span></dd>
+</dl>
+
+<h2 id="Spécifications">Spécifications</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Spécification</th>
+   <th scope="col">Statut</th>
+   <th scope="col">Commentaire</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('File API', '#creating-revoking', 'URL')}}</td>
+   <td>{{Spec2('File API')}}</td>
+   <td>Ajoute les méthodes statiques <code>URL.createObjectURL()</code> et <code>URL.revokeObjectURL</code><code>()</code>.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('URL', '#api', 'API')}}</td>
+   <td>{{Spec2('URL')}}</td>
+   <td>Définition initiale (implémente <code>URLUtils</code>).</td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility">Browser compatibility</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Fonctionnalités</th>
+   <th>Chrome</th>
+   <th>Edge</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>8.0<sup>[2]</sup><br>
+    32</td>
+   <td>In Development<sup>[5]</sup></td>
+   <td>{{CompatGeckoDesktop("2.0")}}<sup>[1][3][6]</sup><br>
+    {{CompatGeckoDesktop("19.0")}}</td>
+   <td>{{CompatNo}}<sup>[4]</sup></td>
+   <td>15.0<sup>[2]</sup><br>
+    19</td>
+   <td>6.0<sup>[2]</sup><br>
+    7.0</td>
+  </tr>
+  <tr>
+   <td><code>username</code>, <code>password</code>, and <code>origin</code></td>
+   <td>{{CompatChrome(52)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("26.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>19</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>searchParams</code></td>
+   <td>{{CompatChrome(51)}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("29.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>36</td>
+   <td>{{CompatNo}}</td>
+  </tr>
+  <tr>
+   <td><code>toJSON</code></td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatGeckoDesktop("54")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile"> </div>
+
+<div>
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Fonctionnalités</th>
+   <th>Android Webview</th>
+   <th>Chrome for Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Mobile</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Basic support</td>
+   <td>4<sup>[2]</sup><br>
+    4.4</td>
+   <td>8.0<sup>[2]</sup><br>
+    32</td>
+   <td>{{CompatGeckoMobile("14.0")}}<sup>[1][3][6]</sup><br>
+    {{CompatGeckoMobile("19.0")}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+   <td>15.0<sup>[2]</sup></td>
+   <td>6.0<sup>[2]</sup></td>
+  </tr>
+  <tr>
+   <td><code>username</code>, <code>password</code>, and <code>origin</code></td>
+   <td>{{CompatChrome(52)}}</td>
+   <td>{{CompatChrome(52)}}</td>
+   <td>{{CompatGeckoDesktop("26.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatVersionUnknown}}</td>
+  </tr>
+  <tr>
+   <td><code>searchParams</code></td>
+   <td>{{CompatChrome(51)}}</td>
+   <td>{{CompatChrome(51)}}</td>
+   <td>{{CompatGeckoMobile("29.0")}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+   <td>{{CompatUnknown}}</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div> </div>
+</div>
+
+<p>[1] De Gecko 2 (Firefox 4) à Gecko 18 inclus, Gecko a mis en oeuvre cette interface avec le type interne non-standard <code>nsIDOMMozURLProperty</code> . <span class="short_text" id="result_box" lang="fr"><span>Comme le seul accès à ce type d'objet était à travers</span></span> {{domxref("window.URL")}}, <span class="short_text" id="result_box" lang="fr"><span>en pratique, cela ne faisait aucune différence.</span></span></p>
+
+<p>[2] Cette fonctionnalité est implémentée sous le nom non-standard <code>webkitURL</code>.</p>
+
+<p>[3] <span id="result_box" lang="fr"><span>Pour Firefox, à utiliser à partir du code chrome, portée JSM et Bootstrap, vous devez l'importer comme ceci :</span></span></p>
+
+<pre class="brush: js line-numbers  language-js"><code class="language-js">Cu<span class="punctuation token">.</span><span class="function token">importGlobalProperties</span><span class="punctuation token">(</span><span class="punctuation token">[</span><span class="string token">'URL'</span><span class="punctuation token">]</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre>
+
+<p><code>URL</code> est disponible pour les portées du "Worker" .</p>
+
+<p>[4] <span id="result_box" lang="fr"><span>Depuis IE11, l'instanciation de nouveaux objets URL n'est pas prise en charge,</span> c'est-à-dire que la <span>nouvelle </span></span> <code>URL()</code> <span lang="fr"><span> ne fonctionne pas.</span></span></p>
+
+<p>[5] Edge en développement : voir <a href="https://developer.microsoft.com/en-us/microsoft-edge/platform/status/urlapi/">https://developer.microsoft.com/en-us/microsoft-edge/platform/status/urlapi/</a>  et <a href="https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6263638-url-api">https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/6263638-url-api</a>.</p>
+
+<p>[6] Firefox a un bogue <span id="result_box" lang="fr"><span>dans lequel les apostrophes contenues dans les URL s'échappent lorsqu'elles sont accessibles par les URL des API </span></span> ({{bug(1386683)}}). <span class="short_text" id="result_box" lang="fr"><span>Cela a été corrigé à partir de Firefox 57</span></span> .</p>
+
+<h2 id="Voir_aussi">Voir aussi</h2>
+
+<ul>
+ <li><span class="short_text" id="result_box" lang="fr"><span>Propriété permettant d'obtenir cet objet</span></span> : {{domxref("Window.URL")}}.</li>
+ <li>{{domxref("URLSearchParams")}}.</li>
+ <li><a href="/en-US/docs/Components.utils.importGlobalProperties">Components.utils.importGlobalProperties (en)</a></li>
+</ul>