Azure, najlepszy sposób na przechowywanie i wdrażanie statycznych treści (np. obrazów/css)?

Wkrótce wdrożymy naszą aplikację internetową. NET do roli internetowej platformy Azure. Zastanawiam się tylko, jak inni radzili sobie ze swoją statyczną zawartością, w szczególności obrazkami i css? W tej chwili nasz pakiet aplikacji wynosi około 25mb, ale 18mb z tego pochodzi wyłącznie z obrazów, rzeczy takich jak przyciski nawigacyjne, ikony i Komponenty szablonów, które rzadko są aktualizowane. Czy rozsądne byłoby wyodrębnienie tego z pakietu wdrożeniowego i przeniesienie go do magazynu blob?

Mam kilka wątpliwości co do to podejście, które się zastanawiam, jest słuszne...

  1. 80% naszej strony działa w środowisku HTTPS. Czy dostęp do obrazów w sklepie blob spowoduje problemy z cross-scriptingiem?

  2. Podatność na wycieki pieniędzy, jeśli ktoś próbuje złośliwie wbić nasze zdjęcia (większość ma poniżej 20KB)?

  3. Nie mogę się doczekać, aby zobaczyć, jak można przesłać pliki do kontenera blob (z VS2010 + Azure SDK) z konwencją nazewnictwa katalogów, więc nie muszę przepisywać 1000 odniesień do ścieżek? Doceniam, że katalogi są abstrakcyjnym pojęciem w kontenerach blob, ale mogę pisać pliki z ukośnikiem do przodu, aby naśladować to w kodzie. Oczywiście System Windows nie pozwala mi to zrobić przed przesłaniem w Visual Studio.

Wszelkie przemyślenia lub alternatywne strategie byłyby mile widziane. Celem naprawdę jest skrócenie naszego pakietu wdrożeniowego, aby przyspieszyć czas wdrażania. Również bardzo podoba mi się pomysł odciążenia obrazu służącego do dedykowanego węzła w celu poprawy wydajność na serwerze WWW, może moja kolekcja obrazów jest tak mała, że nie warto się tym przejmować?

Aktualizacja 16 maja ------------------------------------------------------------------------

Oto co zrobiłem na końcu:

1.Przeniesienie wszystkich obrazów + css do kontenerów blob storage. Zachowałem strukturę wszelkich podkatalogów w folderach images i css.

2.Zastosowałem regułę przepisywania URL w naszej sieci.plik konfiguracyjny jako / align = "left" / .

  <rewrite>
    <rules>
      <rule name="imagestoazure">
      <match url="images/(.*)" />
      <action type="Redirect" url="https://xxxxx.vo.msecnd.net/images/{R:1}" />
    </rule>
  </rules>
  </rewrite>

3.Wykluczono foldery images + css z aplikacji i wdrożono.

Moje wdrożenie jest teraz znacznie mniejsze, a obrazy są uruchamiane z CDN, uwalniając przepustowość, poprawiając prędkość pobierania i uwalniając pewne obciążenie serwera internetowego.

Aktualizacja: Wrzesień 2015

Przeglądając to ostatnio natknąłem się na następujący przewodnik od Microsoftu. Szczegółowo opisuje, w jaki sposób można zautomatyzować wdrażanie zasobów i Cache bust using querystrings.

Obsługa zawartości z usługi Azure CDN w aplikacji internetowej

Author: QFDev, 2013-03-05

3 answers

Niektóre komentarze:

Czy byłoby rozsądne, aby podzielić to z pakietu wdrożeniowego i przenieść go do magazynu blob?

Absolutnie. Widzę wiele korzyści z robienia tego:

  1. Jak już wspomnieliście, zmniejszyłoby to znacznie Rozmiar pakietu, dzięki czemu wdrożenie stanie się znacznie szybsze.
  2. ponownie, jak wspomniałeś, odciąży to twój serwer WWW, dzięki czemu Twoja witryna będzie bardziej responsywna.
  3. Jeśli chcesz zaktualizować obrazy, js, css pliki możesz po prostu zastąpić te pliki w pamięci obiektów blob. Gdyby zostały w Twojej paczce, musiałbyś je przesunąć.
  4. Możesz również skorzystać z Windows Azure CDN, który działa poza pamięcią blob.

80% naszej witryny działa w środowisku HTTPS. Będzie dostęp do zdjęć w sklep blob wprowadza problemy z cross-scriptingiem?

Dopóki nie czytasz treści przez AJAX, nie sądzę, że napotkasz cross-scripting problemy (Jak uzyskać dostęp do XML hostowanego jako Azure blob z witryny azure website ). Jeśli jednak Twoja strona jest obsługiwana przez https, a Ty odwołujesz się do zasobów statycznych przez http, użytkownicy mogą otrzymać wiadomość o mieszanej zawartości (zabezpieczonej i niezabezpieczonej).

Podatność na wycieki pieniędzy, jeśli ktoś próbuje złośliwie hammer nasze zdjęcia (większość jest poniżej 20KB)?

Spójrz na ceny przepustowości wychodzącej tutaj: http://www.windowsazure.com/en-us/pricing/details/#header-11 . obecnie Windows Azure prowadzi promocję, w której do 5 GB transferu danych jest bezpłatny i to $0.12 / GB, co jest dość tanie. Musisz również wziąć pod uwagę transakcje przechowywania, które są również bardzo tanie. Nie martwiłbym się o to zbytnio. W najgorszym przypadku zawsze można przywrócić podpis dostępu współdzielonego i chronić zasoby.

Walczę, aby zobaczyć, jak to jest możliwość wgrywania plików do Bloba kontener (od VS2010 + Azure SDK) z konwencją nazewnictwa katalogów więc nie muszę przepisywać 1000 odniesień do ścieżek? Doceniam to. katalogi są pojęciem abstrakcyjnym w kontenerach blob, ale mogę zapisuj pliki z ukośnikiem do przodu, aby naśladować to w kodzie. Oczywiście System Windows nie pozwala mi tego zrobić przed przesłaniem w Visual Studio.

Dostępnych jest wiele narzędzi innych firm, które zachowają strukturę folderów komputera lokalnego podczas przesyłania do magazynu blob. Zapoznaj się z tym wpisem na blogu zespołu Windows Azure Storage:http://blogs.msdn.com/b/windowsazurestorage/archive/2010/04/17/windows-azure-storage-explorers.aspx. oczywiście moim ulubionym jest Cloud Storage Studio firmy Cerebrata:) [jestem jednym z twórców tego produktu]

 14
Author: Gaurav Mantri,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 12:34:51

Jeśli Twój Pakiet jest zbyt duży, być może możesz skorzystać z wdrożenia samodzielnych plików zamiast dużego pojedynczego pliku pakietu. Co najmniej w Visual Studio 2012 Kreator publikacji ma teraz takie opcje wdrażania:

  • tworzenie stron www (zachęcam do tego)
  • Web Deploy Package
  • FTP
  • System Plików

AFAIK, Web Deploy porównuje pliki źródłowe i docelowe, fizycznie przenosząc tylko różne files (prawdopodobnie porównuje hashe plików, ale nie wiem jak wewnętrzne).

W każdym razie postaram się podać więcej informacji, aby rozwiązać Twoje pytania:

80% naszej witryny działa w środowisku HTTPS. Czy dostęp do obrazów w sklepie blob spowoduje problemy z cross-scriptingiem?

Gaurav Mantri już na to odpowiedział, ale aby zapewnić trochę nowszych informacji, HTTPS jest teraz obsługiwany do uzyskiwania dostępu do usługi Azure CDN, dzięki czemu można uniknąć mieszanej zawartości wiadomość . (Nadal oczekujemy wsparcia dla niestandardowej domeny/certyfikatu SSL (żądanie UserVoice z najnowszymi informacjami tutaj).

Przy okazji, używając konwencji bez protokołu ( ://{domain}/{relative path}) przeglądarka będzie używać dokładnie tego samego protokołu HTTP lub HTTPS jako dokumentu bazowego.

Nie mogę sprawdzić, jak można przesyłać pliki do kontenera blob (z VS2010 + Azure SDK) z konwencją nazewnictwa katalogów, więc nie muszę przepisywać 1000 odwołań do ścieżek? Doceniam to. katalogi są abstrakcyjnym pojęciem w kontenerach blob, ale mogę pisać pliki z ukośnikiem do przodu, aby naśladować to w kodzie. Oczywiście System Windows nie pozwala mi to zrobić przed przesłaniem w Visual Studio.

Synchronizacja plików statycznych do Bloba

Jedną z opcji do synchronizacji plików statycznych jest narzędzie AZCopy .

Alternatywą jest skrypt powershell (więcej informacji na tenpost ), który, podsumowanie:

  1. Robi wstępną konfigurację:

    $context = New-AzureStorageContext ` 
        -StorageAccountName $StorageAccount ` 
        -StorageAccountKey (Get-AzureStorageKey $StorageAccount).Primary
    
  2. Wylicza wszystkie pliki lokalne na .\Content I .\ Scripts:

    $files = (ls -Path $ProjectPath\Content -File -Recurse) + (ls -Path $ProjectPath\Scripts -File -Recurse)
    
  3. ...i wgrywa każdy plik w pętli:

    foreach ($file in $files)  
        { 
            $blobFileName = (Resolve-Path $file.FullName -Relative).TrimStart('.') 
            $contentType = switch ([System.IO.Path]::GetExtension($file)) 
            { 
                ".png" {"image/png"} 
                ".css" {"text/css"} 
                ".js" {"text/javascript"} 
                default {"application/octet-stream"} 
            } 
    
            Set-AzureStorageBlobContent ` 
                -Container $StorageContainer ` 
                -Context $context ` 
                -File $file.FullName ` 
                -Blob $blobFileName ` 
                -Properties @{ContentType=$contentType} ` 
                -Force 
        } 
    

Odwołanie do aktywów CDN

Kolejnym problemem do rozwiązania jest odwoływanie się do plików na CDN, zamiast do plików względnych. Istnieją różne rozwiązania, większość z nich korzysta z funkcji pomocniczych, aby wprowadzić odpowiedni prefiks do ścieżki względnej (Kilka odpowiedzi na poniższe pytanie może Ci pomóc: ASP.NET ścieżki względne MVC ).

W tym celu należy włączyć parametry ciągów zapytań na platformie Azure CDN:

Aby utworzyć scentralizowany sposób budowania adresów URL zasobów CDN, można nawet zaimplementować jakiś rodzaj Cache killer (w tym celu należy włączyć parametry ciągu zapytań na platformie Azure CDN):

Razor:

<img src="@Helper.ToCdnUrl("images/asset1.png")">

Metoda pomocnicza:

public static string ToCdnUrl(string relativePath)
{
    string prefix = ConfigurationManager.AppSettings["CdnUrlBasePath"];
    string sufix = ConfigurationManager.AppSettings["StaticFilesVersion"];
    return String.concat(prefix, relativePath, "?v=", sufix);
}

AppSettings:

<add key="CdnUrlBasePath" value="://<yourCDNName>.vo.msecnd.net/" />
<add key="StaticFilesVersion" value="1.01" />

Renderowany HTML:

<img src="://<yourCDNName>.vo.msecnd.net/images/asset1.png?v=1.01">
 4
Author: Jorge Pestano,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 10:29:31

Jeśli dysk CDN lub Blob nie są opcjami, prostym sposobem na utworzenie folderu obsługującego pliki na platformie Azure (lub standardowym serwerze IIS) jest utworzenie pliku Web.config wewnątrz folderu, jak to wygląda:

<configuration>
    <system.webServer>
        <handlers>
           <clear />
            <add 
                name="StaticFile" 
                path="*" verb="*" 
                modules="StaticFileModule,DefaultDocumentModule,DirectoryListingModule" 
                resourceType="Either" 
                requireAccess="Read" />
        </handlers>
        <staticContent>
            <mimeMap fileExtension=".*" mimeType="application/octet-stream" />
        </staticContent>
    </system.webServer>
</configuration> 
 3
Author: Cigano Morrison Mendez,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-06-25 07:36:42