Staatiliste failide paigutamine muudesse kaustadesse peale wwwrooti

Keskkond

Visuaalstuudio

• Visuaalstuudio 2019

ASP.NET Tuum

• 3.1 (Raseerija leht, MVC)

Staatiliste failide vaikepaigutuse asukoht

Staatilised failid (.js, .css, .png jne) on vaikimisi määratud kausta wwwroot alla. See võimaldab veebisaidi kasutajatel näha .js ja .css faile otse koos HTML-iga ja peegeldada neid ekraanil.

Selle staatilise faili vaikepaigutuskaust on Startup.Configure wwwroot, kuna see kutsub järgmist app.UseStaticFiles meetodis kirjeldatud meetodit:

public class Startup
{
  // 省略

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

    app.UseStaticFiles();

    // 省略
  }
}

Füüsilise kausta "wwwroot" tee on URL-is "https://<host name>/". Näiteks faili wwwroot\image\sample.png leiate URL-ist aadressil https://<host name>/image.png amp; sample.]

Väljaspool kausta wwwroot paigutatud failidele ei viidata sisuliselt veebi URL-ist.

Staatiliste failide paigutamine lisaks kaustale wwwroot ja viitetee muutmine URL-is

Kausta konfiguratsioon

Seekord tahan jätta kausta wwwroot funktsiooni, kuid paigutada pildifaili ka eraldi kausta, et sellele saaks veebis viidata.

Projekti kausta konfiguratsioon peaks olema järgmine, et näeksite pildifaile iga ala sisukaustas.

Selles olekus .png URL faili näidises1.png

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

Ja

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

see võib tunduda nii, aga siin

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

millele viidatakse .

Muide, kui asetate staatilise faili lisaks kaustale wwwroot, võib faili järgutoiming puududa. Kui jätkate avaldamist, siis faili ei paigutata, nii et seadke see kindlasti tagasi sisu juurde.

Programmi lisamine

Staatiliste failide kättesaadavaks tegemiseks mitte-wwwroot Startup.Configure kaustades helistage app.UseStaticFiles meetodi täiendavatele meetoditele järgmiselt:

// 追加
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 Meetodi kutsumine ilma argumentideta lubab kausta wwwroot. Täiendavaid sätteid saate StaticFileOptions lisada, edastades esimese argumendi.

StaticFileOptions.FileProvider Määrab PhysicalFileProvider füüsilise kausta, millele atribuut peaks rakenduse eksemplari läbimisel viitama staatilise failina. Siin määratud tee all olev fail on fail, millele saab veebis viidata. See võib olla ka RequestPath järgmiste atribuutide URL-i juur:

env.ContentRootPath Atribuut sisaldab veebiprogrammi juurteed (füüsilist teed). On hea mõte kombineerida see sihtkausta suhtelise teega.

StaticFileOptions.RequestPath Atribuut kirjeldab staatilile failile viitava URL-i juurteed. Vaike-wwwroot https://<ホスト名> põhineb . Nagu RequestPath = "/Site1" ülaltoodud koodis, kui kirjutate https://<ホスト名>/Site1 on juur. See Areas/Site1/Content/xxxx lingib füüsilise https://<ホスト名>/Site1/xxxx tee URL-iga.

Näitena näidis1.png abil saab Areas/Site1/Content/image/sample.png https://<ホスト名>/Site1/image/sample.png failile viidata teel.

Kontrolli toimingut

index.html Asetage img-silt nii, et näete pilti järgmiselt: Tee viitab ka site1 ja site2 piltidele, nagu määratletud.

<!-- 省略 -->

<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" />
<!-- ここまで追加 -->

Kui sa seda käivitad ja näed pilti, on see edukas.