Comment charger des ressources de fichiers (HTML)
[ Cet article est destiné aux développeurs Windows 8.x et Windows Phone 8.x qui créent des applications Windows Runtime. Si vous développez une application pour Windows 10, voir la Documentation ]
Apprenez à charger les ressources de fichier à partir de différents emplacements.
Vous pouvez accéder aux ressources des fichiers de l’application que vous livrez sous forme de package d’application, ou que vous incluez en tant qu’élément d’un package d’infrastructure ou de composant, ou à partir de données d’application ou du web. Vous pouvez faire référence à ces fichiers dans le balisage (par exemple HTML ou XML de notification) ou par le biais de code (tel que les API Windows.Web.Http ou storage file). Les exemples repris ici illustrent les ressources de fichiers sous des contextes particuliers, mais vous pouvez en utiliser la plupart dans d’autres contextes.
Web
Pour accéder aux fichiers depuis le Web, vous pouvez faire appel à des URI HTTP absolues standard.
<img src="https://www.contoso.com/images/logo.png" alt="Logo" />
Package de l’application
Pour accéder aux fichiers depuis votre package d’application, vous pouvez utiliser un chemin d’accès direct ou logique pour faire référence à la ressource. Cela reste vrai même si le nom de fichier fait état de plusieurs variantes de langues, d’échelles, de contrastes ou autres. Voir Démarrage rapide : utilisation de ressources de fichiers ou d’images pour consulter une présentation.
Par exemple, pour charger
Images/en-US/homeregion-USA/logo.scale-100_contrast-white.png
en faisant référence à
Images/logo.png
Pour accéder aux fichiers relatifs au document actif dans le balisage, vous pouvez utiliser des URI relatifs.
<img src="images/logo.png" />
Pour accéder relativement à des fichiers par rapport à la racine du package, vous pouvez utiliser des URI de chemin d’accès absolus (commençant par "/").
<img src="/images/logo.png" />
Pour accéder à des fichiers stockés au sein du même package mais émanant d’une bibliothèque de classes, utilisez le nom de cette dernière :
<img src="/ClassLibraryName/images/logo.png" />
Pour accéder aux fichiers stockés à l’intérieur du package de l’application, mais à partir de code dans lequel aucune racine n’est inférée à partir du document de base, utilisez le schéma ms-appx:.
var uri = new Windows.Foundation.Uri('ms-appx:///images/logo.png');
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(uri).done(function (file) {
...
});
Pour accéder aux fichiers stockés dans un package d’infrastructure ou de bibliothèque inclus avec l’application, utilisez un URI absolu (et le schéma ms-appx:).
<script src="ms-appx:///Bing.Maps.JavaScript//js/veapicore.js"></script>
Pour accéder aux fichiers à charger dans le compartiment web, faites appel au schéma ms-appx-web:.
<iframe src="ms-appx-web:///html/webcompartment.html"></iframe>
Pour accéder aux fichiers dans le même compartiment Web ou local que le document actif, ne spécifiez aucun schéma.
<script src="//Microsoft.WinJS.2.0/js/ui.js"></script>
Données d’application
Pour accéder aux fichiers stockés dans les données d’application, utilisez le schéma ms-appdata:. Les données d’application peuvent être stockées dans un dossier local, roaming ou temp.
Pour accéder à des fichiers stockés dans le dossier local, procédez comme suit :
<img src="ms-appdata:///local/images/logo.png" />
Pour accéder à des fichiers stockés dans le dossier roaming, procédez comme suit :
<img src="ms-appdata:///roaming/images/logo.png" />
Pour accéder à des fichiers stockés dans le dossier temp, procédez comme suit :
<img src="ms-appdata:///temp/images/logo.png" />
Les storage file APIs peuvent accéder de la même manière aux fichiers se trouvant dans le package d’application :
var uri = new Windows.Foundation.Uri('ms-appdata:///local/images/logo.png');
Windows.Storage.StorageFile.getFileFromApplicationUriAsync(uri).done(function (file) {
...
});
Événements et changements de contexte
Votre application se charge au besoin de l’actualisation de l’affichage de ses ressources.
Des applications du Windows Store peuvent être en cours d’exécution lors des changements apportés au système, notamment lorsque l’utilisateur active le mode Contraste élevé. Cela entraîne l’usage d’un ensemble différent de qualificateurs par l’application. Divers changements système appellent des événements dans l’objet ResourceContext.
Dans JavaScript, le moyen le plus simple pour écouter ces événements repose sur la méthode addEventListener :
WinJS.Resources.addEventListener('contextchanged', refresh, false);
Les éléments d’image ne sont pas mis automatiquement à jour quand le contexte change. Il incombe à l’application de remplacer les images. Les demandes de support CSS sont une alternative permettant de mettre à jour immédiatement les propriétés CSS, par exemple background-image.
Rubriques associées
Comment charger des ressources de type chaîne