Кэширование статических файлов

Последнее обновление: 30.11.2022

Кроме кэширования результатов действий контроллера для оптимизации работы приложения можно применять кэширование статического контекта. В данном случае статический контент - это файлы изображений, скрипты javascript, файлы стилей css, какие-то другие файлы, например, аудио-файлы, используемые на странице. Как правило, подобные файлы в проекте размещаются в папке wwwroot.

Для кэширования статических файлов при их отправке следует установить соответствующие заголовки. Для этого StaticFilesMiddleware передается объект StaticFileOptions, у которого устанавливается свойство OnPrepareResponse:

app.UseStaticFiles(new StaticFileOptions()
{
	OnPrepareResponse = ctx =>
	{
		ctx.Context.Response.Headers.Add("Cache-Control", "public,max-age=600");
	}
});

Свойство OnPrepareResponse представлят делегат Action - некоторое действие, которое в качестве параметра принимает объект StaticFileResponseContext. Через этот объект можно установить заголовки ответа, который будут посылаться вместе со статическими файлами. В частности, в данном случае устанавливается заголовок "Cache-Control", который задает параметры кэширования. Так, значение "public" указывает, что файл будет кэшироваться как в кэше браузера, так и на промежуточных прокси-серверах.

А параметр max-age задает время кэширования в секундах. Так, в данном случае файл кэшируется 10 минут (600 секунд).

Для теста определим небольшой проект ASP.NET Core, в котором в папке wwwroot будут находиться три статических файла: index.html, app.js и styles.css

Кэширование статических файлов в приложении ASP.NET Core на C# и класс StaticFileResponseContext

Допустим, на странице index.html будет какое-то простенькое содержимое и подключение файлов app.js и styles.css:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>METANIT.COM</title>
    <link rel="stylesheet" href="styles.css" />
</head>
<body>
    <h2>Hello METANIT.COM!</h2>
    <script src="app.js"></script>
</body>
</html>

В файле Program.cs определим кэщирование статических файлов:

var builder = WebApplication.CreateBuilder(args);

var app = builder.Build();

app.UseDefaultFiles();
app.UseStaticFiles(new StaticFileOptions()
{
    OnPrepareResponse = ctx =>
    {
        ctx.Context.Response.Headers.Add("Cache-Control", "public,max-age=600");
    }
});

app.Run();

При отправке запроса браузер получит вместе с файлами заголовки ответа, которые устанавливают параметры кэширования:

Кэширование статических файлов в приложении ASP.NET Core на C#

При повторной отправке запроса браузер будет доставать файлы из кэша:

Кэширование статических файлов в приложении ASP.NET Core на C#

Версии файлов

У кэширования есть недостаток: если мы изменим, например, содержимое файла css или javascript, то при повторном обращении к приложению браузер продолжит извлекать нужные файлы из кэша (если срок кэширования не истек). И таким образом, мы будем использовать старые версии файлов.

Для решения этой проблемы можно добавлять к статическим файлам версию и при каждом изменении файла соответственно менять версию файла:

<link rel="stylesheet" href="/css/site.css?v=123" />
<script src="app.js?v=123"></script>

НазадСодержаниеВперед

Помощь сайту
Юмани:
410011174743222
Перевод на карту
Номер карты:
4048415020898850