Placer des fichiers statiques dans des dossiers autres que wwwroot

environnement

Studio visuel

• Studio visuel 2019

ASP.NET noyau

• 3.1 (Page Razor, MVC)

À propos de l’emplacement de placement par défaut pour les fichiers statiques

Les fichiers statiques (.js, .css, .png, etc.) sont déterminés à être sous le dossier wwwroot par défaut. Cela permet aux utilisateurs du site Web de voir les .js et .css fichiers directement avec HTML et de les refléter à l’écran.

Le dossier de placement par défaut pour ce fichier statique est wwwroot Startup.Configure car il appelle la méthode suivante décrite dans la app.UseStaticFiles méthode:

public class Startup
{
  // 省略

  public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
  {
    // 省略

    app.UseStaticFiles();

    // 省略
  }
}

Le chemin du dossier physique « wwwroot » est « https://<host name>/ » dans l’URL. À titre d’exemple, le fichier dans wwwroot\image\sample.png peut être trouvé dans l’URL sous https://<host name>/image.png amp; sample.]

Les fichiers placés en dehors du dossier wwwroot ne sont essentiellement pas référencés à partir d’une URL sur le Web.

Comment placer des fichiers statiques en plus du dossier wwwroot et modifier le chemin de référence à l’URL

Configuration du dossier

Cette fois, je veux laisser la fonction du dossier wwwroot, mais aussi placer le fichier d’image dans un dossier séparé afin qu’il puisse être référencé sur le Web.

La configuration du dossier du projet doit être la suivante, de sorte que vous pouvez voir les fichiers d’image dans le dossier contenu de chaque site dans les zones.

Dans cet état, l’URL .png fichier dans l’échantillon1.png

• https://<hostname>/arenas/site1/content/image/sample1.png

et

• https://<Hostname>/site1/content/image/sample1.png

il peut sembler que ce serait, mais ici

• https://<Hostname>/site1/image/sample1.png

à référencer dans .

Soit dit en passant, si vous placez un fichier statique en plus du dossier wwwroot, l’action de construction du fichier peut être manquante. Si vous continuez à publier, le fichier ne sera pas placé, alors assurez-vous de le remettre au contenu.

Ajouter un programme

Pour rendre les fichiers statiques disponibles dans les dossiers non wwwroot, Startup.Configure appelez des méthodes supplémentaires dans la méthode comme suit app.UseStaticFiles :

// 追加
using Microsoft.Extensions.FileProviders;
using System.IO;

// 省略

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
  // 省略

  // wwwroot フォルダで静的ファイル参照を有効にする
  app.UseStaticFiles();

  // Site1 用の物理コンテンツフォルダと参照 URL を紐づける
  app.UseStaticFiles(new StaticFileOptions()
  {
    FileProvider = new PhysicalFileProvider(Path.Combine(env.ContentRootPath, "Areas/Site1/Content")),
    RequestPath = "/Site1",
  });

  // Site2 用の物理コンテンツフォルダと参照 URL を紐づける
  app.UseStaticFiles(new StaticFileOptions()
  {
    FileProvider = new PhysicalFileProvider(Path.Combine(env.ContentRootPath, "Areas/Site2/Content")),
    RequestPath = "/Site2",
  });

  // 省略
}

app.UseStaticFiles Appeler la méthode sans arguments permet le dossier wwwroot. Vous pouvez ajouter des StaticFileOptions paramètres supplémentaires en passant au premier argument.

StaticFileOptions.FileProvider Spécifie PhysicalFileProvider le dossier physique que vous souhaitez que la propriété se réfère à un fichier statique tout en passant une instance de . Le fichier sous le chemin spécifié ici est un fichier qui peut être référencé sur le Web. Il peut également être la RequestPath racine de l’URL pour les propriétés suivantes:

env.ContentRootPath La propriété contient le chemin racine (chemin physique) du programme Web. C’est une bonne idée de combiner cela avec le chemin relatif vers le dossier cible.

StaticFileOptions.RequestPath La propriété décrit le chemin de racine de l’URL qui fait référence au fichier statique. Le wwwroot par https://<ホスト名> défaut est basé sur . Comme dans le RequestPath = "/Site1" code ci-dessus, si vous écrivez https://<ホスト名>/Site1 est la racine. Cela Areas/Site1/Content/xxxx relie le chemin physique avec https://<ホスト名>/Site1/xxxx l’URL.

En utilisant sample1.png exemple, le Areas/Site1/Content/image/sample.png fichier peut être https://<ホスト名>/Site1/image/sample.png référencé dans le chemin.

Vérifier l’opération

index.html Placez l’étiquette img afin que vous puissiez voir l’image comme suit: Le chemin fait également référence aux images du site1 et du site2 telles que définies.

<!-- 省略 -->

<div class="text-center">
	<h1 class="display-4">Welcome</h1>
	<p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>

<!-- ここから追加 -->
<img src="~/image/sample.png" />
<img src="~/site1/image/sample1.png" />
<img src="~/site2/image/sample2.png" />
<!-- ここまで追加 -->

Si vous l’exécutez et voyez l’image, c’est un succès.